溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點(diǎn)擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》

CSS中單位關(guān)鍵字有哪些

發(fā)布時間:2021-01-25 11:08:53 來源:億速云 閱讀:172 作者:小新 欄目:web開發(fā)

這篇文章主要介紹CSS中單位關(guān)鍵字有哪些,文中介紹的非常詳細(xì),具有一定的參考價值,感興趣的小伙伴們一定要看完!

px:像素(pixel)相對長度單位,,是相對于屏幕顯示器分辨率而言的;

em:em的值并不是固定的,會集成父級元素的字體大小;

 注意:  

 1.body選擇其中聲明Font-size=62.5%;

 2.將原來的px數(shù)值除以10,然后換上em作為單位;

 3.重新計算那些被放大的字體的em數(shù)值。避免字體大小的重復(fù)聲明。

任何瀏覽器默認(rèn)字體大小都是16px,所有未經(jīng)調(diào)整的瀏覽器都符合1em=16px,南無0.75em=12px,10px=0.625em。為了簡化Font-size的換算,需要在css中的body選擇器中聲明Font-size=62.5%,這就使em的值變?yōu)?6px*62.5%=10px,這樣12px就是1.2em,10px就是1em,也就是將原來的px數(shù)值除以10換上em的單位就可以了。

rem:相對單位,(root em 即rem),使用rem為單位設(shè)置字體大小時,是相對于HTML根元素的大 小,可通過該根元素就成比例的修改調(diào)整所有字體大小,一般用的時候都是寫在body或html上面,例:

body{font-size:625%;}

也就是1rem=100px;

不過在寫項(xiàng)目的時候最好搭配媒體查詢一起,比如:   

  html{font-size:10px}      //10px==62.5%

  @media screen and (min-width:321px) and (max-width:375px){html{font-size:11px}}

  @media screen and (min-width:376px) and (max-width:414px){html{font-size:12px}}

  @media screen and (min-width:415px) and (max-width:639px){html{font-size:15px}}

  @media screen and (min-width:640px) and (max-width:719px){html{font-size:20px}}

  @media screen and (min-width:720px) and (max-width:749px){html{font-size:22.5px}}

  @media screen and (min-width:750px) and (max-width:799px){html{font-size:23.5px}}

  @media screen and (min-width:800px){html{font-size:25px}}

vw:視口的最大寬度,1vw=視口寬度的百分之一;

vh:視口得最大高度,1vh=視口高度的百分之一;

vmin/vm:相對于視口的寬度或高度中較小的那個。其中最小的那個被均分為100單位的vmin(即vm)。

以上是“CSS中單位關(guān)鍵字有哪些”這篇文章的所有內(nèi)容,感謝各位的閱讀!希望分享的內(nèi)容對大家有幫助,更多相關(guān)知識,歡迎關(guān)注億速云行業(yè)資訊頻道!

向AI問一下細(xì)節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報,并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI