css中使用rgb的方法

這篇文章給大家分享的是有關(guān)css中使用rgb的方法的內(nèi)容。小編覺得挺實(shí)用的，因此分享給大家做個(gè)參考，一起跟隨小編過來看看吧。

成都創(chuàng)新互聯(lián)公司秉承專業(yè)、誠(chéng)信、服務(wù)、進(jìn)取的價(jià)值觀，堅(jiān)持以客戶為中心、客戶至上的服務(wù)理念，以“關(guān)注企業(yè)需求，實(shí)現(xiàn)企業(yè)價(jià)值”為導(dǎo)向，努力為企業(yè)提供全面優(yōu)質(zhì)的互聯(lián)網(wǎng)應(yīng)用服務(wù)。服務(wù)包括域名與空間、虛擬空間、企業(yè)郵箱、網(wǎng)站建設(shè)、網(wǎng)站優(yōu)化、網(wǎng)絡(luò)營(yíng)銷解決方案和咨詢服務(wù)，以幫助企業(yè)客戶應(yīng)用互聯(lián)網(wǎng)。

css里rgb的使用方法：首先創(chuàng)建一個(gè)HTML代碼示例文件；然后通過rgb語法“rgb(red, green, blue)”來生成各式各樣的顏色即可。

rgb是什么意思？

RGB：一種色彩模式，是工業(yè)界一種顏色標(biāo)準(zhǔn)；可以通過對(duì)紅(R)、綠(G)、藍(lán)(B)三個(gè)顏色通道的變化以及它們相互之間的疊加來獲得到各式各樣的顏色的。RGB 顏色標(biāo)準(zhǔn)幾乎包括了人類視力所能感知的所有顏色，是目前運(yùn)用最廣的顏色系統(tǒng)之一。

css中使用rgb的方法

在css中我們可以采用RGB標(biāo)準(zhǔn)來設(shè)置顏色值，這就需要用到css rgb()函數(shù)。

css rgb()函數(shù)

rgb() 函數(shù)使用紅(R)、綠(G)、藍(lán)(B)三個(gè)顏色的疊加來生成各式各樣的顏色。

RGB 即紅色、綠色、藍(lán)色（英語：Red, Green, Blue）。

紅色（R）0 到 255 間的整數(shù)，代表顏色中的紅色成分。。

綠色（G）0 到 255 間的整數(shù)，代表顏色中的綠色成分。

藍(lán)色（B）0 到 255 間的整數(shù)，代表顏色中的藍(lán)色成分。

推薦：《css視頻教程》

語法

rgb(red, green, blue)

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

css中使用rgb的方法

我們通過一個(gè)簡(jiǎn)單的代碼示例來了解rgb()設(shè)置顏色的方法。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
#p1 {background-color:rgb(255,0,0);}
#p2 {background-color:rgb(0,255,0);}
#p3 {background-color:rgb(0,0,255);}
#p4 {background-color:rgb(192,192,192);}
#p5 {background-color:rgb(255,255,0);}
#p6 {background-color:rgb(255,0,255);}
</style>
</head>
<body>
<p>RGB 顏色:</p>
<p id="p1">紅色</p>
<p id="p2">綠色</p>
<p id="p3">藍(lán)色</p>
<p id="p4">灰色</p>
<p id="p5">黃色</p>
<p id="p6">櫻桃色</p>
</body>
</html>

效果圖：

css中使用rgb的方法

我們要注意一下rgb()顏色值的寫法，下面的代碼示例中rgb()函數(shù)的取值，有一些是對(duì)的，也有一些是錯(cuò)誤的，注意區(qū)分：

/* 使用正整數(shù)的取值方法*/
rgb(255, 0, 51)
rgb(255, 0, 51.2) /* 錯(cuò)誤的寫法，不能是浮點(diǎn)數(shù)，必須為正整數(shù)*/
 
/* 使用%的取值方法*/
rgb(100%, 0%, 20%)
rgb(100%, 0, 20%) /* 錯(cuò)誤的寫法，不能混合使用整數(shù)和百分比值 */

感謝各位的閱讀！關(guān)于“css中使用rgb的方法”這篇文章就分享到這里了，希望以上內(nèi)容可以對(duì)大家有一定的幫助，讓大家可以學(xué)到更多知識(shí)，如果覺得文章不錯(cuò)，可以把它分享出去讓更多的人看到吧！

網(wǎng)站欄目：css中使用rgb的方法
文章網(wǎng)址：http://muchs.cn/article46/ghgdeg.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供定制網(wǎng)站、自適應(yīng)網(wǎng)站、小程序開發(fā)、搜索引擎優(yōu)化、品牌網(wǎng)站設(shè)計(jì)、全網(wǎng)營(yíng)銷推廣

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內(nèi)容