css常用属性总结:颜色和单位
在css代碼編寫中,估計顏色和單位是必不可少的,然而在css中關于顏色和單位值的寫法有很多種寫法,所以有必要把它弄清楚。
顏色
當初我在初學前端的時候,就會冒出一個疑問“我該如何設置網頁顏色?”,一般常用英文顏色名或者十六進制顏色值來設置顏色,但是css中還有一些其他較為復雜的
寫法。
RGB顏色
計算機通過不同級別的紅、綠、藍來產生新的顏色,這就是常說的RGB顏色。有了這樣一個產生顏色的機制,就可以通過直接給出不同的顏色級來確定顏色,就可以自己去
組合三種顏色的值。
寫法:
h1{color:rgb(100%,100%,100%)} 百分比rgb顏色寫法,數字范圍從0%到100%
h1{color:rgb(0,255,255)} 數字rgb顏色寫法,數字范圍從0到255
注意:兩種寫法的值都會被修剪,百分比會被修剪成0%-100%,即超出100%被修剪成100%,低于0%修剪成0%,數字則會被修剪成0-255,另外,兩者不能混寫,混寫是不會生效的。
十六進制顏色和顏色名設置顏色我們就不再提了
單位
長度單位:一般分為絕對單位和相對單位。絕對單位從誕生之日起其實用的很少,至少我平時在項目上很少用到。所以這里就跳過了絕對單位的介紹。
相對單位:有三種相對的長度單位,em、ex和px。前兩種分別代表“元素的字體高度”和“字母shezhi‘x’的高度”,他們是普通印刷上的量度,最后一個px代表“像素”,之所以說它是
? ? ? ? ? ? ? ? ?相對的,是因為它依賴顯示器的分辨率。
em:css中,一個“em”就是給定字體的font-size值。唯一例外的就是在設置字體尺寸,這種情況下em的值是相對于父元素的。
如
- body{font-size:20px;}
- p{font-size:1em;}
這時p的字體大小就是20px,而不是默認的16px。
px:按像素值px來設置。如
body{font-size:20px;}
p{font-size:16px;}
p元素中字體的大小就是16px
百分比值:同長度單位比較,百分比就顯得很簡單,就是一個百分比值。例如:
h1{line-height:150%;} 設置所有h1的行高比普通行高大一半。
總之百分比總是通過另外一個值來計算的,這些在后面屬性講解中會一一提到。而且百分比可正可負,對于有些屬性只接受正值,這就另說了。
今天的內容就這么多,寫的有點亂,希望以后越寫越好吧。
總結
以上是生活随笔為你收集整理的css常用属性总结:颜色和单位的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: bootstrap到底是用来做什么的(概
- 下一篇: line-height与图片底部间隙的学