最适合网络开发者的网站
HTML 颜色。初学者课程

尿素

颜色教程

通过红光、绿光和蓝光组合显示颜色。


颜色名称

使用 CSS,可以使用颜色名称设置颜色:

例子

颜色 姓名
 红色的
 黄色的
 青色
 蓝色的
 品红
亲自尝试 »

CSS 颜色值

使用 CSS,可以通过不同的方式指定颜色:

  • 按颜色名称
  • 作为 RGB 值
  • 作为十六进制值
  • 作为 HSL 值 (CSS3)
  • 作为 HWB 值 (CSS4)
  • 随着 currentcolor 关键词

RGB 颜色

所有浏览器都支持 RGB 颜色值。

RGB 颜色值通过以下方式指定:rgb( 红色的 , 绿色的 , 蓝色的 ).

每个参数将颜色的强度定义为 0 到 255 之间的整数。

例如,rgb(0,0,255) 被渲染为蓝色,因为蓝色参数设置为其最高值(255),而其他参数设置为 0。

例子

颜色 RGB 颜色
  RGB(255,0,0) 红色的
  RGB(0,255,0) 绿色的
  RGB(0,0,255) 蓝色的
亲自尝试 »

灰色阴影通常使用所有 3 个光源的相同值来定义:

例子

颜色 RGB 颜色
  RGB(0,0,0) 黑色的
  RGB(128,128,128) 灰色的
  RGB(255,255,255) 白色的
亲自尝试 »

十六进制颜色

所有浏览器也支持十六进制颜色值。

十六进制颜色用以下方式指定:#无线电规则GGBB.

RR(红色)、GG(绿色)和 BB(蓝色)是 00 到 FF 之间的十六进制整数,表示颜色的强度。

例如,#0000FF 显示为蓝色,因为蓝色成分设置为其最高值 (FF),而其他成分设置为 00。

例子

颜色 十六进制 RGB 颜色
  #FF0000 RGB(255,0,0) 红色的
  #00FF00 RGB(0,255,0) 绿色的
  #0000FF RGB(0,0,255) 蓝色的
亲自尝试 »

灰色阴影通常使用所有 3 个光源的相同值来定义:

例子

颜色 十六进制 RGB 颜色
  #000000 RGB(0,0,0) 黑色的
  #808080 RGB(128,128,128) 灰色的
  #FFFFFF RGB(255,255,255) 白色的
亲自尝试 »

大写还是小写?

您可以使用大写或小写字母来指定十六进制值。

小写字母较易书写,大写字母较易阅读。


颜色名称

CSS 支持 140 种标准颜色名称。

在下一章中,您将找到按十六进制值按字母顺序排列的颜色名称完整列表:

颜色名称 十六进制 颜色
艾丽丝布鲁 #F0F8FF  
古董白 #FAEBD7  
水蓝色 #00FFFF  
蓝晶 #7FFFD4  
Azure #F0FFFF  
浅褐色的 #F5F5DC  
浓汤 #FFE4C4  

currentcolor 关键字

currentcolor 关键字指的是元素的颜色属性的值。

例子

下面的边框颜色 <div> 元素将为蓝色,因为文本颜色<div> 元素为蓝色:

#我的DIV{
颜色:蓝色;/*蓝色文本颜色*/
border: 10px solid currentcolor; /* 蓝色边框颜色 */
}
亲自尝试 »