菜单
×
   ❮     
HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY EXCEL XML DJANGO NUMPY PANDAS NODEJS R TYPESCRIPT ANGULAR GIT POSTGRESQL MONGODB ASP AI GO KOTLIN SASS VUE DSA GEN AI SCIPY AWS CYBERSECURITY DATA SCIENCE
     ❯   

颜色教程

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


颜色名称

使用 CSS,颜色可以通过使用颜色名称来设置

示例

颜色 名称
 红色
 黄色
 青色
 蓝色
 洋红色
自己动手试一试 »

CSS 颜色值

使用 CSS,颜色可以通过多种方式指定

  • 按颜色名称
  • 作为 RGB 值
  • 作为十六进制值
  • 作为 HSL 值 (CSS3)
  • 作为 HWB 值 (CSS4)
  • 使用 currentcolor 关键字

RGB 颜色

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

RGB 颜色值指定为:rgb( RED , GREEN , BLUE )。

每个参数定义颜色的强度,为一个介于 0 和 255 之间的整数。

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

示例

颜色 RGB 颜色
  rgb(255,0,0) 红色
  rgb(0,255,0) 绿色
  rgb(0,0,255) 蓝色
自己动手试一试 »

灰色调通常使用所有三种光源的相同值来定义

示例

颜色 RGB 颜色
  rgb(0,0,0) 黑色
  rgb(128,128,128) 灰色
  rgb(255,255,255) 白色
自己动手试一试 »


十六进制颜色

十六进制颜色值在所有浏览器中都受支持。

十六进制颜色指定为:#RRGGBB.

RR (红色)、GG (绿色) 和 BB (蓝色) 是介于 00 和 FF 之间的十六进制整数,用于指定颜色的强度。

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

示例

颜色 HEX RGB 颜色
  #FF0000 rgb(255,0,0) 红色
  #00FF00 rgb(0,255,0) 绿色
  #0000FF rgb(0,0,255) 蓝色
自己动手试一试 »

灰色调通常使用所有三种光源的相同值来定义

示例

颜色 HEX RGB 颜色
  #000000 rgb(0,0,0) 黑色
  #808080 rgb(128,128,128) 灰色
  #FFFFFF rgb(255,255,255) 白色
自己动手试一试 »

大写或小写?

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

小写更容易输入。大写更容易阅读。


颜色名称

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

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

颜色名称 十六进制 颜色
爱丽丝蓝 #F0F8FF  
古董白 #FAEBD7  
水绿色 #00FFFF  
海蓝色 #7FFFD4  
蔚蓝色 #F0FFFF  
米色 #F5F5DC  
杏仁白 #FFE4C4  

currentcolor 关键字

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

示例

以下 <div> 元素的边框颜色将是蓝色,因为 <div> 元素的文本颜色是蓝色。

#myDIV {
  color: blue; /* 蓝色文本颜色 */
  border: 10px solid currentcolor; /* 蓝色边框颜色 */
}
自己动手试一试 »

×

联系销售

如果您想将 W3Schools 服务用于教育机构、团队或企业,请发送电子邮件给我们
sales@w3schools.com

报告错误

如果您想报告错误,或想提出建议,请发送电子邮件给我们
help@w3schools.com

W3Schools 经过优化,旨在方便学习和培训。示例可能经过简化,以提高阅读和学习体验。教程、参考资料和示例会不断审查,以避免错误,但我们无法保证所有内容的完全正确性。使用 W3Schools 即表示您已阅读并接受我们的使用条款Cookie 和隐私政策

版权所有 1999-2024 Refsnes Data。保留所有权利。W3Schools 由 W3.CSS 提供支持