下一节:

  颜色 教程

  • CSS 颜色值

    使用CSS，可以用不同的方式指定颜色：
    颜色
    • 使用颜色名称
    • 使用RGB值
    • 使用十六进值
    • 使用HSL值（CSS3）
    • 使用HWB值（CSS4）
    • 使用currentcolor关键字

  • 颜色名称

    使用CSS，可以使用颜色名称设置颜色：

    示例

    颜色 颜色名称
      Red
      Yellow
      Cyan
      Blue
      Magenta
    尝试一下
    CSS支持148种标准颜色名称，如下：
    颜色名称 Hex 颜色
    AliceBlue #F0F8FF  
    AntiqueWhite #FAEBD7  
    Aqua #00FFFF  
    Aquamarine #7FFFD4  
    Azure #F0FFFF  
    Beige #F5F5DC  
    Bisque #FFE4C4  
    在下一章中，您将找到带有十六进制值的颜色名称的完整字母列表。

  • RGB 颜色

    所有浏览器均支持 RGB 颜色值。
    RGB 颜色值指定为：rgb(RED，GREEN，BLUE)。
    每个参数将颜色的强度定义为0到255之间的整数。
    例如，rgb(0,0,255) 呈现为蓝色，因为 blue 参数设置为其最高值（255），其他参数设置为0。

    示例

    颜色 RGB 颜色名称
      rgb(255,0,0) Red
      rgb(0,255,0) Green
      rgb(0,0,255) Blue
    尝试一下
    通常为所有3个光源使用相等的值来定义灰色阴影：

    示例

    颜色 RGB 颜色名称
      rgb(0,0,0) Black
      rgb(128,128,128) Gray
      rgb(255,255,255) White
    尝试一下

  • 十六进制颜色

    所有浏览器也支持十六进制颜色值。
    这是一个十六进制颜色：#RRGGBB
    RR（红色），GG（绿色）和 BB（蓝色）是介于00和FF之间的十六进制整数，用于指定颜色的强度。
    例如，＃0000FF 显示为蓝色，因为蓝色分量设置为最高值（FF），其他分量设置为00。

    示例

    颜色 HEX RGB 颜色名称
      #FF0000 rgb(255,0,0) Red
      #00FF00 rgb(0,255,0) Green
      #0000FF rgb(0,0,255) Blue
    尝试一下
    通常为所有3个光源使用相等的值来定义灰色阴影：

    示例

    颜色 HEX RGB 颜色名称
      #000000 rgb(0,0,0) Black
      #808080 rgb(128,128,128) Gray
      #FFFFFF rgb(255,255,255) White
    尝试一下
    您可以使用大写或小写字母来指定十六进制值。
    小写更容易写。 大写字母更易于阅读。

  • currentcolor 关键字

    currentcolor关键字是指元素的color属性的值。
    以下<div>元素的边框颜色将为蓝色，因为<div>元素的文本颜色为蓝色： 
    #myDIV {
  color: blue; /* Blue text color */
  border: 10px solid currentcolor; /* Blue border color */
}
    尝试一下
下一节: