CSS中對RGB顏色的使用詳解

 　　RGB顏色模型解釋

　　RGB顏色模型就是一種描述某個顏色裡面有多少紅、綠、藍三原色的量的方法，就像把水彩顏料或油彩顏料混合起來得到某種我們想要的真實色彩一樣。

　　想象下如果你要配出一個純藍色，為了實現這個，你就不能把紅色和綠色放進這個顏色裡。所以我們就把紅、綠設定為0%，把綠設定為100%：

　　CSS Code複製內容到剪貼簿

　　rgb(0%, 0%, 100%)

　　結果:

　　但如果你想要的不是藍色而是紫紅色，那該怎麼辦呢?我們可以通過將100%的紅和100%的藍混合起來得到紫紅色：

　　CSS Code複製內容到剪貼簿

　　rgb(100%, 0%, 100%)

　　結果:

　　從基礎的色彩理論，我們知道了沒有任何顏色就是黑色。所以為了得到黑色我們可以通過設定紅、綠、藍三原色為0%來實現：

　　CSS Code複製內容到剪貼簿

　　rgb(0%, 0%, 0%)

　　結果:

　　如何確定RGB顏色的值

　　我們可以使用Photoshop的拾色器功能來擷取特定色彩的紅、綠、藍三原色的數值，但也有免費的網上工具比如Color Slider和The RGB Color Calculator。

　　w3school上對RGB顏色的解釋：

　　RGB 顏色

　　所有瀏覽器都支援 RGB 顏色值。

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

　　舉例說，rgb(0,0,255) 值顯示為藍色，這是因為 blue 參數被設定為最高值(255)，而其他被設定為 0。

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

　　執行個體

　　CSS Code複製內容到剪貼簿

　　p

　　{

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

　　}