CSS中值的單位

1.顏色值

被各種瀏覽器支持，并且作為 CSS 規(guī)范推薦的顏色名稱只有 16 種，如下表所示。

?

百分比表示

color: rgb(100%, 100%, 100%);

這個(gè)聲明將紅、藍(lán)、綠 3 種原色都設(shè)置為最大值，結(jié)果組合顯示為白色。相反，可以設(shè)置rgb(0%, 0%, 0%)為黑色。3 個(gè)百分值相等將顯示灰色，同理哪個(gè)百分值大就偏向哪個(gè)原色。

數(shù)值

color: rgb(255, 255, 255);

?

數(shù)字范圍從 0~255，3 個(gè)數(shù)值相等將顯示灰色，同理哪個(gè)數(shù)值大哪個(gè)原色的比重就會(huì)加大。

十六進(jìn)制顏色

color: #ffffff;

從 0~255，實(shí)際上十進(jìn)制的 255 正好等于十六進(jìn)制的 FF，一個(gè)十六進(jìn)制的顏色值等于 3 組這樣的十六進(jìn)制的值，它們按順序連接在一起就等于紅、藍(lán)、綠3種原色。

2.絕對(duì)單位

相對(duì)單位與絕對(duì)單位相比顯示大小不是固定的，它所設(shè)置的對(duì)象受屏幕分辨率、可視區(qū)域、瀏覽器設(shè)置以及相關(guān)元素的大小等多種因素影響。

1) em

em 單位表示元素的字體高度，它能夠根據(jù)字體的 font-size 屬性值來(lái)確定單位的大小。

2) ex

ex 單位根據(jù)所使用的字體中小寫(xiě)字母 x 的高度作為參考。在實(shí)際使用中，瀏覽器將通過(guò) em 的值除以 2 得到 ex 的值。

3) px

px 單位是根據(jù)屏幕像素點(diǎn)來(lái)確定的。這樣不同的顯示分辨率就會(huì)使相同取值的 px 單位所顯示出來(lái)的效果截然不同。

實(shí)際設(shè)計(jì)中，建議網(wǎng)頁(yè)設(shè)計(jì)師多使用相對(duì)長(zhǎng)度單位 em，且在某一類型的單位上使用統(tǒng)一的單位。如設(shè)置字體大小，根據(jù)個(gè)人使用習(xí)慣，在一個(gè)網(wǎng)站中，可以統(tǒng)一使用 px 或 em。

3.百分比

百分比也是一個(gè)相對(duì)單位值。百分比值總是通過(guò)另一個(gè)值來(lái)計(jì)算，一般參考父對(duì)象中相同屬性的值。例如，如果父元素寬度為 500px，子元素的寬度為 50%，則子元素的實(shí)際寬度為 250px。

百分比可以取負(fù)值，但在使用中受到很多限制。

?

轉(zhuǎn)載于:https://www.cnblogs.com/flyingcarp/p/10016929.html

創(chuàng)作挑戰(zhàn)賽新人創(chuàng)作獎(jiǎng)勵(lì)來(lái)咯，堅(jiān)持創(chuàng)作打卡瓜分現(xiàn)金大獎(jiǎng)

總結(jié)

以上是生活随笔為你收集整理的CSS中属性的值和单位的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。