文章目錄

• • • • 1. 關(guān)鍵字
      • 2. 十六進(jìn)制
      • 3. RGB
      • 4. rgba

1. 關(guān)鍵字

可直接輸入顏色的英文拼寫單詞

border-color: red;

2. 十六進(jìn)制

所有瀏覽器都支持十六進(jìn)制顏色值

十六進(jìn)制顏色是這樣規(guī)定的：
#RRGGBB 其中的 RR（紅色）、GG（綠色）、BB（藍(lán)色）十六進(jìn)制整數(shù)規(guī)定了顏色的成分。
所有值必須介于 0 與 FF 之間。

舉例說(shuō) #0000ff 值顯示為藍(lán)色，這是因?yàn)樗{(lán)色成分被設(shè)置為最高值（ff），而其他成分被設(shè)置為 0。

border-color: #0000ff;

3. RGB

所有瀏覽器都支持 RGB 顏色值

RGB 顏色值是這樣規(guī)定的：
rgb(red, green, blue)
每個(gè)參數(shù) (red、green 以及 blue) 定義顏色的強(qiáng)度，可以是介于 0 與 255 之間的整數(shù)，或者是百分比值（從 0% 到 100%）。

舉例說(shuō) rgb(0,0,255) 值顯示為藍(lán)色，這是因?yàn)?blue 參數(shù)被設(shè)置為最高值（255），而其他被設(shè)置為 0。

同樣地，下面的值定義了相同的顏色：
rgb(0,0,255) 和 rgb(0%,0%,100%)。

border-color: rgb(255,0,0);

4. rgba

以下瀏覽器支持 rgba 顏色：
IE9+、Firefox 3+、Chrome、Safari 以及 Opera 10+

顏色值是 RGB 顏色值的擴(kuò)展，帶有一個(gè) alpha 通道，它規(guī)定了對(duì)象的不透明度 。
顏色值是這樣規(guī)定的：
rgba(red, green, blue, alpha)
alpha 參數(shù)是介于 0.0（完全透明）與 1.0（完全不透明）的數(shù)字。

值得一提的是，當(dāng)設(shè)置透明度的時(shí)候，可以寫 0 也可以不寫 0

例如：
rgba(255, 0, 0, 0.5)
rgba(255, 0, 0, .5)
這兩個(gè)效果其實(shí)都是一樣的

border-color: rgba(255, 0, 0, 1)

參考資料:
w3c：CSS 合法顏色值

總結(jié)

以上是生活随笔為你收集整理的CSS颜色的四种写法的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

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