CSS - color 属性

上一页

CSS color 属性设置元素的前景色（通常是文本的颜色）。

可能的值

  • <color> − 应为任何有效的颜色值。
    • 关键字：示例 = red
    • 十六进制值：示例 = #ff00ff
    • rgb 值：示例 = rgb（255,125,200）
  • currentcolor − color 属性值设置为元素的颜色，当分配给 color 属性时，currentcolor 被视为继承的。

适用于

所有元素和文本。它还适用于 ::first-letter 和 ::first-line。

语法


 color: <color> | currentcolor;

CSS color - <color> 值

以下示例使用 color 属性演示了红色 h2 标题、黄色段落文本和粉红色文本 -


<html>
<head>
<style>
	 	h2 {
	 	 	 color: red;
	 	}
	 	p {
	 	 	 color: #ffff00;
	 	}
	 	div {
	 	 	 color: rgb(224,37,197);
	 	}
</style>
</head>
<body>
	 	<h2>
	 	 	 This text will have red color.
	 	</h2>
	 	<p>
	 	 	 This text will have yellow color.
	 	</p>
	 	<div>
	 	 	 This text will have pink color.
	 	</div>
</body>
</html>

CSS color - currentcolor 值

以下示例演示 .inherit-color 类将其文本颜色设置为 currentcolor，这意味着它继承了其父容器 （.color-text） 的颜色 -


<html>
<head>
<style>
	 	.color-text {
	 	 	 color: green;	
	 	}
	 	.inherit-color {
	 	 	 color: currentcolor;	
	 	}
</style>
</head>
<body>
	 	<div class="color-text">
	 	 	 This text has the initial color set to green.
	 	 	 <p class="inherit-color">This text inherits the color (green) from the parent container.</p>
	 	</div>
</body>
</html>

 

打印本页
上一页