您好,登錄后才能下訂單哦!
這篇文章主要介紹了html中長(zhǎng)度如何表示,具有一定借鑒價(jià)值,需要的朋友可以參考下。希望大家閱讀完這篇文章后大有收獲。下面讓小編帶著大家一起了解一下。
其實(shí)css中的長(zhǎng)度單位一共有8個(gè),分別是px,em,pt,ex,pc,in,mm,cm;
px:像素(Pixel),相對(duì)于設(shè)備的長(zhǎng)度單位,像素是相對(duì)于顯示器屏幕分辨率而言的。譬如,WONDOWS的用戶所使用的分辨率一般是96像素/英寸。而MAC的用戶所使用的分辨率一般是72像素/英寸。
em:相對(duì)長(zhǎng)度單位。相對(duì)于當(dāng)前對(duì)象內(nèi)文本的字體尺寸。如當(dāng)前行內(nèi)文本的字體尺寸未被人為設(shè)置,則相對(duì)于瀏覽器的默認(rèn)字體尺寸。
ex:相對(duì)長(zhǎng)度單位。相對(duì)于字符“x”的高度。此高度通常為字體尺寸的一半。如當(dāng)前對(duì)行內(nèi)文本的字體尺寸未被人為設(shè)置,則相對(duì)于瀏覽器的默認(rèn)字體尺寸。
pt:點(diǎn)(Point),絕對(duì)長(zhǎng)度單位。
pc:派卡(Pica),絕對(duì)長(zhǎng)度單位。相當(dāng)于我國(guó)新四號(hào)鉛字的尺寸。
in:英寸(Inch),絕對(duì)長(zhǎng)度單位。
mm:毫米(Millimeter),絕對(duì)長(zhǎng)度單位。
cm:厘米(Centimeter),絕對(duì)長(zhǎng)度單位。
其中:1in = 2.54cm = 25.4 mm = 72pt = 6pc ;
容器的大小我們經(jīng)常用px做單位,大家都沒(méi)什么異議,字體大?。╢ont-size)很多國(guó)內(nèi)的人使用px做單位,其實(shí)用px做字體單位唯一的致命缺點(diǎn)就是在IE下無(wú)法用瀏覽器字體縮放的功能?;蛘咭郧暗陌醋trl+滾動(dòng)鼠標(biāo)的中間的滾輪。
所以多人建議使用html em單位,對(duì)于用慣了px的人用em肯定不是很方便,這里提供一些轉(zhuǎn)換公式和對(duì)照表供大家參考:
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
Pixels | EMs | Percent | Points |
---|---|---|---|
6px | 0.375em | 37.5% | 5pt |
7px | 0.438em | 43.8% | 5pt |
8px | 0.5em | 50% | 6pt |
9px | 0.563em | 56.3% | 7pt |
10px | 0.625em | 62.5% | 8pt |
11px | 0.688em | 68.8% | 8pt |
12px | 0.75em | 75% | 9pt |
13px | 0.813em | 81.3% | 10pt |
14px | 0.875em | 87.5% | 11pt |
15px | 0.938em | 93.8% | 11pt |
16px | 1em | 100% | 12pt |
17px | 1.063em | 106.3% | 13pt |
18px | 1.125em | 112.5% | 14pt |
19px | 1.188em | 118.8% | 14pt |
20px | 1.25em | 125% | 15pt |
21px | 1.313em | 131.3% | 16pt |
22px | 1.375em | 137.5% | 17pt |
23px | 1.438em | 143.8% | 17pt |
24px | 1.5em | 150% | 18pt |
最后pCSS5推薦使用PX像素為單位布局網(wǎng)頁(yè):
感謝你能夠認(rèn)真閱讀完這篇文章,希望小編分享html中長(zhǎng)度如何表示內(nèi)容對(duì)大家有幫助,同時(shí)也希望大家多多支持億速云,關(guān)注億速云行業(yè)資訊頻道,遇到問(wèn)題就找億速云,詳細(xì)的解決方法等著你來(lái)學(xué)習(xí)!
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。