成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

css中的尺寸和單位

noONE / 3587人閱讀

摘要：前言本文主要介紹的尺寸和單位，專門查了加上自己的一些理解。比如等屬性的類型分為絕對單位和相對單位相對單位相對單位代表以其他距離為尺寸的一種單位，包括，，，，。

前言

本文主要介紹css的尺寸和單位，專門查了mdn, 加上自己的一些理解。本文參考mdn

類型

length表示距離尺寸的一種css數(shù)據(jù)格式,它由數(shù)值+單位組成，如果數(shù)值為0，單位可以省略。比如width, height, margin, font-size,text-shadow等屬性, css的length類型分為絕對單位和相對單位

相對單位

相對單位代表以其他距離為尺寸的一種單位，包括em，rem，ex，lh，rlh。這幾個單位沒什么好說的，不知道自己查文檔。我主要來說下和視口相關(guān)的幾個相對單位的使用：vw，vh，vi，vb，vmax，vmin
提出中文mdn文檔的一個錯誤： 當(dāng)視口的大小被修改（通過更改桌面計算機窗口大小或旋轉(zhuǎn)手機或平板設(shè)備的方向）時，只有基于Gecko的瀏覽器才動態(tài)更新視口值，只有基于Gecko的瀏覽器才能動態(tài)更新視口值，可以測試一下，說法并不正確:
經(jīng)測試在chrome, IE7以上都是正常的，中文文檔誤人:-D

    window.onresize = function () {
        console.log(document.documentElement.clientWidth || document.body.clientWidth);
    }

指出中文mdn文檔的另外一個錯誤如果html和body設(shè)置了overflow:auto，滾動條占據(jù)的空間不會從視口中減去（譯者注：大概就是說會算在視口里，視口大小是包括滾動條的），但當(dāng)設(shè)置為overflow:scroll時，滾動條占據(jù)的空間反而會從視口中減去（譯者注：大概就是此時視口大小不包括滾動條）。, 明顯又是一個誤導(dǎo):-D。英文文檔里沒有這兩點，英文不好的話，就中英文一塊看吧

vi和vb，vi是沿著包含塊的內(nèi)聯(lián)軸方向尺寸的1%，vb是包含擴沿著包含塊的塊軸方向尺寸的1%
對這兩個單位的兼容性比較差，基本在所有瀏覽器上都不兼容。但是這兩個單位引出了兩個比較有趣的概念包含塊和塊軸，內(nèi)聯(lián)軸

vh和vw，視口高度的1%和視口寬度的1%?？捎脕碜隹缮炜s布局，但是兼容性沒有rem好。所以目前還是rem布局居多，vh和vw看到網(wǎng)易新聞有用到vw設(shè)置字體大小，不知道目的何在，不過vw確實可以用來做移動端布局

vmin，vmax, 視口寬度和高度之間的最小值的1%，視口寬度和高度之間的最大值的1%

絕對單位

絕對單位包括px，pt，in, mm, cm等。絕對單位這種翻譯容易造成誤解。比如《css編程指南》中對于絕對單位的描述：絕對單位其實也是一種相對單位，

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

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

相關(guān)文章

  • 關(guān)于CSS中的字體尺寸設(shè)置

    摘要：常用單位在中可以用很多不同的方式來設(shè)定字體的尺寸。當(dāng)你為一個元素添加單位時，應(yīng)當(dāng)考慮到所有父元素的字體尺寸。例寬度是中新提出的一個單位，通過寬度來計算字體尺寸。 個人翻譯，轉(zhuǎn)載請注明出處 英文原文：CSS Font Sizing 寫在前面 上一篇文章如何做好移動端的響應(yīng)式設(shè)計：Viewport控制討論到了CSS像素，于是我決定研究一下如何用不同的方式來在CSS中設(shè)定字體...

    mcterry 評論0 收藏0

  • css中的尺寸和單位

    摘要：前言本文主要介紹的尺寸和單位，專門查了加上自己的一些理解。比如等屬性的類型分為絕對單位和相對單位相對單位相對單位代表以其他距離為尺寸的一種單位，包括，，，，。 前言 本文主要介紹css的尺寸和單位，專門查了mdn, 加上自己的一些理解。本文參考mdn 類型 length表示距離尺寸的一種css數(shù)據(jù)格式,它由數(shù)值+單位組成，如果數(shù)值為0，單位可以省略。比如width, height, m...

    cod7ce 評論0 收藏0

  • css中的尺寸和單位

    摘要：前言本文主要介紹的尺寸和單位，專門查了加上自己的一些理解。比如等屬性的類型分為絕對單位和相對單位相對單位相對單位代表以其他距離為尺寸的一種單位，包括，，，，。 前言 本文主要介紹css的尺寸和單位，專門查了mdn, 加上自己的一些理解。本文參考mdn 類型 length表示距離尺寸的一種css數(shù)據(jù)格式,它由數(shù)值+單位組成，如果數(shù)值為0，單位可以省略。比如width, height, m...

    Yujiaao 評論0 收藏0

  • CSS 單位

    摘要：概覽中的長度單位有很多，覺得有必要整理備忘。單位大體分為兩大類絕對單位，不會因為其他元素的尺寸變化而變化。如果想使用顯示窗口的寬度或高度而不是父元素的寬度將會怎么樣這正是和單位所提供的。和現(xiàn)代瀏覽器都支持這兩個單位。 概覽 CSS中的長度單位有很多，覺得有必要整理備忘。 網(wǎng)上介紹的也比較多和全，詳見參考資料。 單位大體分為兩大類： 絕對單位 ，不會因為其他元素的尺寸變化而變化。 相對...

    ARGUS 評論0 收藏0

  • 【響應(yīng)式布局】initial containing block、viewport以及相關(guān)尺寸

    摘要：影響著其中元素的尺寸和定位。在標(biāo)準(zhǔn)中，元素的稱為。當(dāng)?shù)膶挾雀叨仁褂冒俜謹?shù)的值時，這個百分數(shù)的基準(zhǔn)就是的尺寸。例子其中就溢出了的區(qū)域。造成以上不同的原因是，在桌面端的縮放和在移動端的縮放有不同的性質(zhì)。這兩個數(shù)值的單位是設(shè)備獨立像素。 前言 本篇文章修改、整理自我以前寫的一篇文章。 在閱讀這篇文章之前，你需要了解設(shè)備像素、邏輯像素（設(shè)備獨立像素）和CSS像素的區(qū)別，見我的前一篇文章理解設(shè)備...

    weknow619 評論0 收藏0

發(fā)表評論

0條評論

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