我們在顯示屏上看到的各種顏色都是通過紅(red)、綠(green)、藍(blue)三原色組合而成的,按不同的比例混合這三種顏色就可以得到其它顏色,通過調整紅、綠、藍三種顏色的數值可以最大限度的控制顏色。
CSS 中提供了一些屬性(例如 color、background)來設置 HTML 元素的顏色(例如元素的背景顏色或字體顏色),我們可以通過不同形式的值來指定顏色,如下表所示:
使用顏色名稱來設置顏色是最簡單的方法。CSS 中定義了一些表示顏色的關鍵字,如下表中所示,使用這些關鍵字可以輕松的為元素設置顏色。
除了上表中介紹的 17 個顏色外,瀏覽器中還支持很多的顏色名稱,但不同的瀏覽器之間對顏色的解析可能存在差異,為了安全起見,不建議您在 CSS 中使用顏色名稱來指定顏色。
十六進制碼是指通過一個以#開頭的 6 位十六進制數(0~9,a~f)表示顏色的方式,這個六位數可以分為三組,每組兩位,依次表示 red、green、blue 三種顏色的強度,例如:
您可以使用 PhotoShop、Fireworks 等制圖軟件來獲取顏色的十六進制碼,如下圖所示:
提示:在使用十六進制碼表示顏色時,如果每組的兩個十六進制數是相同的,例如 #00ff00、#ffffff、#aabbcc,則可以將它們簡寫為 #0f0、#fff、#abc。
RGB 是 red、green、blue 的縮寫,它是一種色彩模式,可以通過對 red、green、blue 三種顏色的控制來實現各式各樣的顏色。CSS 中要使用 RGB 模式來設置顏色需要借助 rgb() 函數,函數的語法格式如下:
rgb(red, green, blue)
其中 red、green、blue 分別表示三原色紅、綠、藍的強度,這三個參數的取值可以是 0~255 之間的整數,也可以是 0%~100% 之間百分比數值。如下例所示: