CSS Units(單位)

單位用于在CSS屬性中指定非零長度值,CSS常用的單位有：px，em，pt，百分比（%）等。

了解CSS單位

測量長度的單位可以是絕對單位，例如像素，點等，也可以是相對單位，例如百分比（%）和em單位。

非零值必須指定CSS單位，因為沒有默認(rèn)單位。缺少或忽略一個單位將被視為錯誤。但是，如果值為0，則可以省略單位（畢竟，零像素與零英寸是相同的度量）。

相對長度單位

相對長度單位指定相對于另一個長度屬性的長度。相對單位是：

該em和ex單位取決于套用至元素的字體大小。

使用Em單位

度量1em等于font-size使用它的元素的屬性的計算值。它可以用于垂直或水平測量。

例如，如果font-size將元素的設(shè)置為16px并line-height設(shè)置為2.5em，則line-heightin像素的計算值是2.5?x?16px?=?40px。

p {
    font-size: 16px;
    line-height: 2.5em;
}

在font-size屬性本身的值中指定em時會發(fā)生異常，在這種情況下，它引用父元素的字體大小。

因此，當(dāng)我們在中指定字體大小時em，1em等于Inherited font-size。因此，font-size: 1.2em;使文本比父元素的文本大1.2倍。

body {
    font-size: 62.5%;
    font-family: Arial, Helvetica, sans-serif;
}
p {
    font-size: 1.6em;
}
p:firt-letter {
    font-size: 3em;
    font-weight: bold;
}

讓我們了解一下這段代碼的全部含義。在所有現(xiàn)代瀏覽器中，字體的默認(rèn)大小為16px。我們的第一步是通過將正文設(shè)置font-size為62.5％來減小整個文檔的大小，這會將字體大小重置為10px（16px的62.5％）。

這是四舍五入的默認(rèn)font-size，方便px到em轉(zhuǎn)換。

使用防爆裝置

的ex單位等于當(dāng)前字體的x高度。

之所以稱它為x高度，是因為它通常等于小寫字母“ x”的高度，如下所示。但是，ex甚至為不包含“ x”的字體也定義了。

絕對長度單位

絕對長度單位彼此固定。它們高度依賴于輸出介質(zhì)，因此在已知輸出環(huán)境時尤其有用。絕對單位由物理單位（的in，cm，mm，pt，pc）和px單位。

絕對物理單位，例如in，cm，mm等應(yīng)被用于打印介質(zhì)和類似的高分辨率的設(shè)備。而對于臺式機和低分辨率設(shè)備等屏幕顯示，建議使用像素或em單位。

h1 { margin: 0.5in; }       /* inches  */
h2 { line-height: 3cm; }    /* centimeters */
h3 { word-spacing: 4mm; }   /* millimeters */
h4 { font-size: 12pt; }     /* points */
h5 { font-size: 1pc; }      /* picas */
h6 { font-size: 12px; }     /* picas */