課程
/前端開發(fā)
/Html5
/HTML5+CSS3實現(xiàn)春節(jié)賀卡
老師,您好。請問您的圖片尺寸計算方法是怎么算的,如:音樂轉(zhuǎn)盤的長寬為75px,那么您怎么轉(zhuǎn)化為15vw的昵,對此不是太明白,還望解答一下。謝謝老師。
2016-02-08
源自:HTML5+CSS3實現(xiàn)春節(jié)賀卡 3-3
正在回答
vw是view-width的縮寫,相應(yīng)地還有vh是view-height的縮寫。他們分別指的是視窗寬度和高度(移動端
即設(shè)備寬度和設(shè)備高度)。
1vw等價于1%的視窗寬度,15vw指的就是15%視窗寬度。
那么接下來看為什么是15vw。你所說的75px我查了一下是music_disc.png的尺寸,而我們現(xiàn)在正在定義
的是#music的寬高對不對? #music這個div里不僅僅只有disc這一個元素,還有一個白色的背景和一個
紅色的圓環(huán)邊框。因此僅分配75px是不足的。
我在視頻當中用截圖工具進行測量,
可以看到視窗寬高大致是320*570,#music寬高應(yīng)該是50*50
用計算器計算50/320之后得到0.156,即15.6%
等價用15.6vw表示。
juanjuanyao
這個。。。其實
示例代碼:
h1{font-size:8vw;}
如果視口的寬度是200mm,那么上述代碼中h1元素的字號將為16mm,即(8x200)/100
就是實際的尺寸占屏幕寬度的比例,15vw就是15%的大小,這樣總可以理解了呀。單位轉(zhuǎn)換就不多說了
舉報
又逢新春佳節(jié),春節(jié)賀卡搞起來,學會HTML5+CSS3實現(xiàn)春節(jié)賀卡
3 回答關(guān)于vw的問題
1 回答關(guān)于寬高vw,vh
2 回答關(guān)于vw和vh以及rem的計算問題?
2 回答vw的兼容性問題。。
1 回答vw寬度問題
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網(wǎng)安備11010802030151號
購課補貼聯(lián)系客服咨詢優(yōu)惠詳情
慕課網(wǎng)APP您的移動學習伙伴
掃描二維碼關(guān)注慕課網(wǎng)微信公眾號
2016-02-11
vw是view-width的縮寫,相應(yīng)地還有vh是view-height的縮寫。他們分別指的是視窗寬度和高度(移動端
即設(shè)備寬度和設(shè)備高度)。
1vw等價于1%的視窗寬度,15vw指的就是15%視窗寬度。
那么接下來看為什么是15vw。你所說的75px我查了一下是music_disc.png的尺寸,而我們現(xiàn)在正在定義
的是#music的寬高對不對? #music這個div里不僅僅只有disc這一個元素,還有一個白色的背景和一個
紅色的圓環(huán)邊框。因此僅分配75px是不足的。
我在視頻當中用截圖工具進行測量,
可以看到視窗寬高大致是320*570,#music寬高應(yīng)該是50*50
用計算器計算50/320之后得到0.156,即15.6%
等價用15.6vw表示。
2016-02-09
這個。。。其實
示例代碼:
h1{font-size:8vw;}
如果視口的寬度是200mm,那么上述代碼中h1元素的字號將為16mm,即(8x200)/100
就是實際的尺寸占屏幕寬度的比例,15vw就是15%的大小,這樣總可以理解了呀。單位轉(zhuǎn)換就不多說了