首頁  >  文章  >  web前端  >  在CSS中對RGB顏色的使用分析

在CSS中對RGB顏色的使用分析

不言
不言原創
2018-06-12 16:11:262218瀏覽

這篇文章主要介紹了CSS中對RGB顏色的使用詳解,是CSS入門學習中的基礎知識,需要的朋友可以參考下

RGB顏色模型解釋

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

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

rgb(0%, 0%, 100%)

結果:

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

rgb(100%, 0%, 100%)

結果:

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

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%)。
實例

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

以上就是本文的全部內容,希望對大家的學習有所幫助,更多相關內容請關注PHP中文網!

相關推薦:

使用css實現陰影效果

#在CSS3中常用的幾種顏色漸變模式

以上是在CSS中對RGB顏色的使用分析的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn