CSS color 属性用来设置一个元素的文本颜色和文本的修饰元素的颜色。
文本的颜色通常我们称为前景色,使用CSS color
属性可以设置文本的颜色,color
属性设置的颜色同时还会被应用到使用text-decoration
属性设置的修饰线条元素上。
文本的颜色可以使用任何<color>数据类型来定义,它可以是半透明的,或是完全透明的颜色。但是文本的颜色不可以使用渐变数据类型,因为渐变是一种<image>数据类型,而不是颜色数据类型。
如果为一个父元素设置了某种文字颜色,那么它的所有子元素都会继承这个文字颜色,除非你为子元素另外指定一种文字颜色。
如果color
属性的取值为currentColor
,它的行为和color:inherit
相同。
官方语法
color: <color>
参数:
- <color>:任何合法的颜色值,可以参考<color>数据类型。
color
属性的初始值由浏览器来决定,通常浏览器会将它设置为黑色。
应用范围
color
属性可以应用在所有元素上。
示例代码
/* CSS Level 1 color */ color: red; /* The only color added in CSS Level 2 (Revision 1) */ color: orange; /* CSS Level 3 color, sometimes called a SVG or X11 color */ color: antiquewhite; /* The color 'lime' with the 3-character dash notation */ color: #0f0; /* The color 'lime' with the 6-character dash notation */ color: #00ff00; /* A color using the available functional notations */ color: rgba( 34, 12, 64, 0.3); /* Use the color of this element's direct ancestor */ color: currentcolor; color: inherit;
在线演示
下面是一个设置元素的文字颜色的简单示例:
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
浏览器支持
所有的现代浏览器都支持color
属性,包括Chrome,Firefox,Safari,Opera,IE 以及 Android 和 iOS。