pt px em rem用法和特點

2021-09-27 04:32:34 字數 1509 閱讀 4835

1. pt

點(points),絕對長度單位。

印刷業上常使用的單位,磅的意思,一般用於頁面列印排版。

不知道經常做設計的同學知不知道zeplin這個**,它用的畫素單位都是pt。

1in = 2.54cm = 25.4 mm = 101.6q = 72pt = 6pc = 96px

用法:div

12. px

相對長度單位。畫素(pixels)。畫素px是相對於顯示器螢幕解析度而言的。

div

1相容性和pt一樣

px不會因為其它元素的尺寸變化而變化。

畫素的大小是會「變」的,也稱為「相對長度」,越高位的畫素,其擁有的色板也就越豐富,越能表達顏色的真實感。

px特點:比較穩定和精確,但在瀏覽器放大縮小會出現頁面混亂。

一般情況下,我們平時都是用px來定義字型,所以無法用瀏覽器字型放大的功能,ie無法調整那些使用px作為單位的字型大小。大部分**能調整是因為用了相對長度單位em或rem。如果改變了瀏覽器的縮放,web頁面樣式就會亂掉,這樣對於使用者來說,就是個大問題了。這時,就提出了相對長度單位。

firefox能夠調整px和em,rem,但是96%以上的中國網民使用ie瀏覽器(或核心)。

假設就使用瀏覽器預設的字型大小16px,來看一些px單位與rem之間的轉換關係:

如果你要設定乙個不同的值,那麼需要在根元素中定義,為了方便計算,時常將在元素中設定font-size值為62.5%:

html

相當於在中設定font-size為10px,此時,上面示例中所示的值將會改變:

3.em

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

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

相對長度單位。畫素(pixels)。

div

相容性和pt一樣。

em特點:

(1)em的值並不是固定的

(2)em會繼承父級元素的字型大小

em表示相對于父元素的字型大小,em是相對單位,沒有乙個固定的度量值,而是由其它元素尺寸來決定的相對值。如當前對行內文字的字型尺寸未被人為設定,則相對於瀏覽器的預設字型尺寸。

任意瀏覽器的預設字型都是16px,所有未經調整的瀏覽器都符合:1em =16px。那麼12px = 0.75em;10px = 0.625em;為了簡化font-size的換算,需要在css中的body選擇器中宣告font-size=62.5%,這就使em值變為:16px*62.5% =10px;這樣12px=1.2em;10px=1em,也就是說只需要將你原來數值px除以10就可以了。

使用em的注意點:

1. body選擇器中宣告font-size=62.5%;

2. 將你的原來的px數值除以10,然後換上em作為單位;

3. 重新計算那些被放大的字型的em數值。避免字型大小的重複宣告。

4. rem

相對長度單位。相對於根元素(即html元素)font-size計算值的倍數。是css3新增的乙個相對單位(root em,根em)

div

頁面適配之pt px em rem用法和特點

1.pt 點 points 絕對長度單位。印刷業上常使用的單位,磅的意思,一般用於頁面列印排版。不知道經常做設計的同學知不知道zeplin這個 它用的畫素單位都是pt。1in 2.54cm 25.4 mm 101.6q 72pt 6pc 96px 用法 div 2.px 相對長度單位。畫素 pixe...

c var型別用法和特點

var在編譯器編譯的時候根據初始值推斷出其的型別 如果我們要遍歷乙個陣列,此時我們並不知道陣列中儲存的資料型別是什麼,那麼在這時,我們使用var關鍵字,就可以比較方便了 1.在定義變數的時候,必須先給值,不能為null,也不能只定義不給值。也就是說必須是例如 var s hello world 的形...

sizeof 用法和特點 大小端模式

1.在c語言中,sizeof 是用於判斷資料型別長度的關鍵字也是一種運算子 求資料型別所佔的位元組個數 使用 sizeof 括號中可以寫資料型別也可以寫物件,或者直接跟物件不加括號 例如 sizeof int sizeof a sizeof a 都對 sizeof int 這是錯誤的,由於int是資...