亚洲中字慕日产2020,大陆极品少妇内射AAAAAA,无码av大香线蕉伊人久久,久久精品国产亚洲av麻豆网站

資訊專欄INFORMATION COLUMN

px、em、rem、%、vw、vh、vm這些單位的區(qū)別

xcc3641 / 1281人閱讀

摘要：就是像素，也是我們現(xiàn)在經(jīng)常使用的基本單位，比如常常聽到的電腦像素是的，表示的是水平方向是個像素點，垂直方向是個像素點。視口被均分為單位再舉個例子瀏覽器寬度相對于視口的寬度。等于視口高度的。

1.px

px就是像素，也是我們現(xiàn)在經(jīng)常使用的基本單位，比如常常聽到的電腦像素是1024x768的，表示的是水平方向是1024個像素點，垂直方向是768個像素點。

2.em

em參考物是父元素的font-size，默認字體大小是16px，所以1em不是固定值，因為它會繼承父元素的字體大小

3.rem

rem參考物是相對于根元素，我們在使用時可以在根元素設(shè)置一個參考值即可，相對于em使用，減少很大運算工作量，例：html大小為10px，12rem就是120px

4.%

% 是相對于父元素的大小設(shè)定的比率，position:absolute;的元素是相對于已經(jīng)定位的父元素，position：fixed；的元素是相對可視窗口

5.vm

vm相對于視口的寬度。視口被均分為100單位

h1 {
    font-size: 8vw;
}

再舉個例子：瀏覽器寬度1200px, 1 vw = 1200px/100 = 12 px

6.vh

vm相對于視口的寬度。視口被均分為100單位

h1 {
    font-size: 8vh;
}

再舉個例子：瀏覽器高度900px, 1 vh = 900px/100 = 9 px

總結(jié)：

 
 
  1.vw：1vw等于視口寬度的1%。
  2.vh：1vh等于視口高度的1%。

但是使用起來兼容性很差，還是不推薦使用，目前用的很舒服的還是px和rem，

安利一對換算單位的網(wǎng)站，幫助更好的理解現(xiàn)在常用的px/em/rem之間的倍數(shù)關(guān)系：
http://pxtorem.com/ px 換算 rem

http://pxtoem.com/ px 換算 em

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://www.ezyhdfw.cn/yun/114684.html

相關(guān)文章

  • <em>pxem>、em、rem、%、vw、vh、vm這些單位的區(qū)別

    摘要：就是像素，也是我們現(xiàn)在經(jīng)常使用的基本單位，比如常常聽到的電腦像素是的，表示的是水平方向是個像素點，垂直方向是個像素點。視口被均分為單位再舉個例子瀏覽器寬度相對于視口的寬度。等于視口高度的。 1.px px就是像素，也是我們現(xiàn)在經(jīng)常使用的基本單位，比如常常聽到的電腦像素是1024x768的，表示的是水平方向是1024個像素點，垂直方向是768個像素點。 2.em em參考物是父元素的fo...

    simpleapples 評論0 收藏0

  • 【CSS練習(xí)】IT修真院--練習(xí)3-簡單界面

    摘要：任務(wù)三一個最簡單的移動端頁面今天完成的事情運用布局知識跟隨設(shè)計圖進行布局，完成簡單并繼續(xù)學(xué)習(xí)優(yōu)化讓布局更好適應(yīng)屏幕變化使用了盒模型及百分比了解區(qū)別在中應(yīng)用圖片處理學(xué)習(xí)明天計劃的事情深度思考手機分辨率和網(wǎng)頁的區(qū)別周末補學(xué)任務(wù)四計劃及簡單編寫遇 任務(wù)三、 一個最簡單的移動端頁面 今天完成的事情 運用布局知識跟隨設(shè)計圖進行布局，完成簡單Demo并繼續(xù)學(xué)習(xí)優(yōu)化. 讓布局更好適應(yīng)屏幕變化(使用...

    MrZONT 評論0 收藏0

  • 視口相關(guān)單位的應(yīng)用 —— 別說你懂CSS相對單位

    摘要：還有視口相關(guān)單位，依賴瀏覽器的視口大小來定義長度的。如果你不熟悉視口相關(guān)單位的話，在這里簡單介紹一下。筆記視口相關(guān)單位對于大多數(shù)瀏覽器還是一項比較新的特性，所以當你試圖把這個特性和其他樣式混搭時，有可能會有一些很奇怪的。 前段時間試譯了Keith J.Grant的CSS好書《CSS in Depth》，其中的第二章《Working with relative units》，書中對rel...

    lbool 評論0 收藏0

  • CSS中常見的長度單位

    摘要：可視區(qū)高度單位和可視區(qū)寬度單位單位與可視區(qū)的高度相關(guān)。的值等于可視區(qū)高度的。因此會隨著父元素對應(yīng)的長度值得變化而變化。 px - 像素 px 是 CSS 中最常用的長度單位，可以用來指定字體大小，元素的寬度、高度、邊框、內(nèi)邊距，外邊距的大小等等, 它是一個虛擬長度單位，是計算機系統(tǒng)的數(shù)字化圖像長度單位，如果px要換算成物理長度，需要指定精度DPI px 單位的值必須是整數(shù)值 與px相關(guān)...

    rainyang 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<