理解css中長度單位

2021-08-30 16:49:03 字數 1016 閱讀 3997

**:

寫css的時候最常用的長度單位是px(畫素),經常看到的還有em,pt等等,其實css中的長度單位一共有8個,分別是 px,em,pt,ex,pc,in,mm,cm;

1. px:畫素(pixel),相對於裝置的長度單位,畫素是相對於顯示器螢幕解析度而言的。

譬如,wondows的使用者所使用的解析度一般是96畫素/英吋。而mac的使用者所使用的解析度一般是72畫素/英吋。

2. em:相對長度單位。相對於當前物件內文字的字型尺寸。

如當前行內文字的字型尺寸未被人為設定,則相對於瀏覽器的預設字型尺寸。

3. pt:點(point),絕對長度單位。

4. ex:相對長度單位。相對於字元「x」的高度。此高度通常為字型尺寸的一半。

如當前對行內文字的字型尺寸未被人為設定,則相對於瀏覽器的預設字型尺寸。

5. pc:派卡(pica),絕對長度單位。相當於我國新四號鉛字的尺寸。

6. in:英吋(inch),絕對長度單位。

7. mm:公釐(millimeter),絕對長度單位。

8. cm:厘公尺(centimeter),絕對長度單位。

* px to em: example: 12px / 16px = .75em

* px to %: example: 12px / 16px * 100 = 75%

* px to pt: example: 16px * 72 (72 points = 1 inch) / 96 (96 pixels per inch in windows, 72 in mac) = 12pt

* em to px: example: .75em * 16px = 12px

* em to %:example: .75em * 100 = 75%

* % to px:example: 75 * 16px / 100 = 12px

* % to em:example: 75 / 100 = .75em

* pt to px: example: 12pt * 96ppi / 72ppi = 16px

關於Android中長度單位

看到有很多不太理解dp sp和px的區別 現在這裡介紹一下dp和sp。dp也就是dip。這個和sp基本類似。如果設定表示長度 高度等屬性時可以使用dp 或sp。但如果設定字型,需要使用sp。dp是與密度無關,sp除了與密度無關外,還與scale無關。如果螢幕密度為160,這時dp和sp和px是一樣的...

SS中長度單位pt px dpi詳解

在印刷排版中 point 是乙個絕對的單位,它等於 1 72 英吋。可以用尺子丈量的,物理的英吋。但在css中pt的含義卻非如此,例如我們指定乙個字型是9pt,瀏覽器會以css規範解釋,它等於 9 1 72 1 8 inch 這是乙個誤解,因為我們的顯示器被分割為了乙個個的畫素,單個畫素只能有一種顏...

理解css中的長度單位

很基礎的乙個問題,但是,其實看起來很複雜的樣子 我們來捋一捋吧 css3中也對css中用到的單位進行了改進,單位也就是那幾個,所以我們要搞清楚再用。我們常用的有px em,px就不多說了,em和 多說點兒 1 2 3.box 元素的行高是當前元素繼承的font size的1.3倍,1 2 3.box...