1. 顏色由紅色、綠色、藍色混合而成。

2. CSS顏色

2.1. 可以用以下方法來規定CSS中的顏色:

?2.1.1. 十六進制色

?2.1.2. RGB顏色

?2.1.3. RGBA顏色

?2.1.4. HSL顏色

?2.1.5. HSLA顏色

?2.1.6. 預定義/跨瀏覽器顏色名

2.2. 最常用的顏色單位

3. rgb顏色

3.1. 所有瀏覽器都支持rgb顏色值。

3.2. rgb顏色值是這樣規定的: rgb(red, green, blue)。每個參數(red、green以及blue)定義顏色的強度, 可以是介于0與255之間的整數, 或者是百分比值(從0%到100%)。

3.2. rgb(0,0,255)值顯示為藍色, 這是因為blue參數被設置為最高值(255), 而其他被設置為0。

3.3. 同樣地, 這兩個是相同的顏色值: rgb(0,0,255)和rgb(0%,0%,100%)。

3.4. 實例

p {background-color: rgb(255,0,0); }

4. rgba顏色

4.1. rgba顏色值是rgb顏色值的擴展, 帶有一個alpha通道, 它規定了對象的不透明度。

4.2. rgba顏色值是這樣規定的: rgba(red,green,blue,alpha)。alpha參數是介于0.0(完全透明, 就不顯示了)與1.0(完全不透明)的數字。

4.3. 實例

p {background-color: rgba(255,0,0,0.5); }

5. 十六進制顏色

5.1. 所有瀏覽器都支持十六進制顏色值。請盡可能的使用十六進制顏色值。

5.2. 十六進制顏色是這樣規定的: #RRGGBB, 其中的RR(紅色)、GG(綠色)、BB(藍色)十六進制整數規定了顏色的成分。所有值必須介于0與FF之間。

5.3. 下面列出了幾個重要的顏色:

5.4. 實例

p {background-color: #0000ff; }

6. hsl顏色

6.1. hsl指的是hue(色調)、saturation(飽和度)、lightness(亮度), 表示顏色柱面坐標表示法。

6.2. hsl顏色值是這樣規定的: hsl(hue, saturation, lightness)。

6.3. hue(色調)是色盤上從0到360的度數。0是紅色, 120是綠色, 240是藍色。

6.4. saturation(飽和度)可以描述為顏色的強度, 是一個百分比值。100％是純色, 沒有灰色陰影; 50％是50％灰色, 但是您仍然可以看到顏色; 0％是完全灰色, 您無法再看到顏色。

6.5. lightness(亮度)顏色的明暗度可以描述為要賦予顏色多少光, 也是百分比。其中0％表示不亮(黑色); 50％表示50％亮(既不暗也不亮); 100％表示全明(白)。

6.6. 實例

p {background-color: hsl(120,65%,75%); }

7. hsla顏色

7.1. hsla顏色值是hsl顏色值的擴展, 帶有一個alpha通道, 它規定了對象的不透明度。

7.2. hsla顏色值是這樣規定的: hsla(hue, saturation, lightness, alpha), 其中的alpha參數定義不透明度。alpha參數是介于0.0(完全透明)與1.0(完全不透明)的數字。

7.3. 實例

p {background-color: hsla(120,65%,75%,0.3); }

8. CSS顏色名

8.1. 所有瀏覽器都支持的顏色名。

8.2. html和CSS顏色規范中定義了140多種顏色名(其中16種標準顏色)。

8.3. 16種標準顏色是: aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, yellow。

8.4. 以顏色名排序:

總結

以上是生活随笔為你收集整理的018_CSS颜色的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。