CSS rgb() -funktio

määrittely ja käyttötapa

CSS:n rgb() funktio käyttämällä punainen-vihreä-sininen (RGB) värimallia. Voit myös lisätä valinnaisen läpinäkyvyyden kanavan (väriintensiteetin).

RGB-väriarvot määritetään rgb(punainen vihreä sininen) Määritä. Jokainen parametri määrittelee väriintensiteetin, joka voi olla kokonaisluku 0-255 väliltä tai prosenttiosuus 0%-100% väliltä.

Esimerkiksi, rgb(0 0 255) arvo näyttää siniseltä, koska sininen parametri on asetettu suurimmaksi (255), ja muut parametrit asetettu 0:ksi.

注意：rgba() 函数是 rgb() 函数的别名。建议使用 rgb() 函数。

实例

定义不同的 RGB(A) 颜色：

#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);} /* 樱桃色 */
#p7 {background-color:rgb(255 0 255 / 0.2);} /* 带透明度的樱桃色 */
#p8 {background-color:rgb(0 0 255 / 50%);} /* 带透明度的蓝色 */

亲自试一试

CSS 语法

绝对值语法

rgb(R G B / A)
值 描述
R

必需。定义红色的强度，可以是 0 到 255 之间的整数或 0% 到 100% 之间的百分比。

也可以使用 none（等同于 0%）。
G

必需。定义绿色的强度，可以是 0 到 255 之间的整数或 0% 到 100% 之间的百分比。

也可以使用 none（等同于 0%）。
B

必需。定义蓝色的强度，可以是 0 到 255 之间的整数或 0% 到 100% 之间的百分比。

也可以使用 none（等同于 0%）。
/ A

可选。表示颜色的透明度通道值，0%（或 0）表示完全透明，100%（或 1）表示完全不透明。

也可以使用 none（表示无透明度通道）。默认值为 100%。

相对值语法

rgb(from color R G B / A)
值 描述
from color

以关键字 from 开头，后跟表示原始颜色的颜色值。

这是相对颜色所基于的原始颜色。
R

必需。定义红色的强度，可以是 0 到 255 之间的整数或 0% 到 100% 之间的百分比。

也可以使用 none（等同于 0%）。
G

必需。定义绿色的强度，可以是 0 到 255 之间的整数或 0% 到 100% 之间的百分比。

也可以使用 none（等同于 0%）。
B

必需。定义蓝色的强度，可以是 0 到 255 之间的整数或 0% 到 100% 之间的百分比。

也可以使用 none（等同于 0%）。
/ A

可选。表示颜色的透明度通道值，0%（或 0）表示完全透明，100%（或 1）表示完全不透明。

也可以使用 none（表示无透明度通道）。默认值为 100%。

技术细节

版本： CSS2

浏览器支持

表格中的数字表示首个完全支持该函数的浏览器版本。

Chrome Edge Firefox Safari Opera
rgb()
1 4 1 1 3.5
rgb() 带透明度参数
65 79 52 12.1 52
Väliä erottavat parametrit
65 79 52 12.1 52