HTML-響應式基本用法
在網站建造中，響應式網站時經常用到的，今天我們就來熟悉一下什么是響應式，好比一個正常的網頁，若是是打開的網頁尺寸寬度是1200px,當設置響應式后，設置為達到800px時，網站發生轉變。下面我們就以一個簡單的圖形變換作為參考。
東西/原料
- HTML
- Dreamweaver
方式/步調
- 1
打開Dreamweaver軟件，新建一個HTML文件
- 2
在body標簽中成立一個盒標簽div
- 3
成立CSS樣式，添加對div的一些潤色，如圖將圖形設置為一個矩形，填充紅色
- 4
將文件保留后，在瀏覽器中預覽，結果如圖所示
- 5
然后添加響應式代碼，固心猿意馬搭配 @media(max-width:800){}
小括號內添加前提，最年夜或最小 ；年夜括號內添加轉換后結果屬性
- 6
這里將響應后發生的轉變是：寬度降低到400px;高度為300px;顏色轉為藍色；如圖所示設置
- 7
然后保留在瀏覽器中查看結果，默認時是紅色矩形，當拖動瀏覽器窗口到800px時，發生轉變，轉為藍色小矩形。
注重事項
- 若是此經驗對您有幫忙，請為我投票加存眷，感謝大師的撐持^_^
- 發表于 2018-08-05 00:00
- 閱讀 ( 694 )
- 分類：其他類型
admin
0 篇文章
作家榜 ?
-
xiaonan123
189 文章
-
湯依妹兒
97 文章
-
luogf229
46 文章
-
jy02406749
45 文章
-
小凡
34 文章
-
Daisy萌
32 文章
-
我的QQ3117863681
24 文章
-
華志健
23 文章