IT技术网
-
菜鸟教程
-
CSS 系列
-
CSS参考手册
»
属性列表
»
颜色属性
»
相关内容：
其它颜色属性参考
选择其它项
color
opacity
color
版本：CSS1
继承性：有
语法：
color
：
<color>
取值：
<color>
：
指定颜色。
说明：
检索或设置对象的文本颜色。无默认值
可以使用
Color Name(颜色名称)
,
HEX
,
RGB
,
RGBA
,
HSL
,
HSLA
,
transparent
来指定color。
注意，用颜色名称指定color可能不被一些浏览器接受。
对应的脚本特性为
color
。
兼容性：
浅绿
= 支持
红色
= 不支持
墨绿
= 部分支持
橙色
= 实验性质
支持版本
\类型
IE
Firefox
Safari
Chrome
Opera
版本
6.0-8.0
#1
4.0
5.1
13.0
11.50
版本
9.0
IE8及更早浏览器不支持color的RGBA, HSL, HSLA及transparent值。
示例：
<!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="utf-8" /> <title>color_CSS参考手册_web前端开发参考手册系列-IT技术菜鸟教程</title> <meta name="author" content="OK设计网 www.oksheji.com" /> <meta name="copyright" content="IT技术菜鸟教程" /> <style> .colorname p{color:green;} .hex p{color:#ff0000;} .rgb p{color:rgb(0,0,0);} .rgba p{color:rgba(0,0,0,.5);} .hsl p{color:hsl(240,50%,50%);} .hsla p{color:hsla(240,50%,50%,.5);} .transparent p{color:transparent;} </style> </head> <body> <ul class="test"> <li class="colorname"> <strong>Color Name(用颜色名称表示法)</strong> <p>看看我的颜色 {color:green;}</p> </li> <li class="hex"> <strong>HEX(十六进制数值表示法)</strong> <p>看看我的颜色 {color:#ff0000;}</p> </li> <li class="rgb"> <strong>RGB</strong> <p>看看我的颜色 {color:rgb(0,0,0);}</p> </li> <li class="rgba"> <strong>RGBA</strong> - IE8及以下浏览器不支持这种写法 <p>看看我的颜色 {color:rgba(0,0,0,.5);}</p> </li> <li class="hsl"> <strong>HSL</strong> - IE8及以下浏览器不支持这种写法 <p>看看我的颜色 {color:hsl(240,50%,50%);}</p> </li> <li class="hsla"> <strong>HSLA</strong> - IE8及以下浏览器不支持这种写法 <p>看看我的颜色 {color:hsla(240,50%,50%,.5);}</p> </li> <li class="transparent"> <strong>transparent</strong> - IE8及以下浏览器将文本颜色设置为transparent，文本将显示为黑色 <p>看看我的颜色 {color:transparent;}</p> </li> </ul> </body> </html>
