2016-07-02 09:48:15 css 字体颜色设置篇,使用CSS对文字字体颜色设置使用CSS样式单词为color,这里css5为大家介绍几种CSS字体颜色设置方法。
css 字体颜色设置 DIV CSS字体颜色如何设置篇
使用CSS对文字字体颜色设置使用CSS样式单词为color,这里HTML8为大家介绍几种CSS字体颜色设置方法。
一、css字体颜色color代码
color:#000(准确颜色值 推荐使用)
color:red(不常用)
div{color:#F00}
对div内文字字体颜色设置为红色。
二、直接标签设置字体颜色(标签内使用style)
要设置字体颜色的盒子对象标签内直接使用style属性设置css color字体颜色。
CSS字体颜色小例代码:
<div style="color:#F00">HTML8 我是红色字体</div>
标签内使用style属性效果截图:
字体颜色设置截图
#F00红色
可以DW软件直接选择此颜色值。
DW软件选择颜色值截图
常用测试时候可以使用DW提示出的颜色值,但实际布局中时需要PS获取准确颜色值,以美工图上的字体颜色值为准。
三、外部CSS设置字体颜色
使用id或class对文字字体设置颜色值
1、字体颜色实例CSS代码:
.expa{ color:#00F}
2、HTML代码:
<div class="expa">HTML8 我是蓝色字体</div>
3、完整HTML+CSS代码
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>字体颜色实例 HTML8</title>
<style>
.expa{ color:#00F}
</style>
</head>
<body>
<div class="expa">HTML8 我是蓝色字体</div>
</body>
</html>
4、外部CSS字体颜色设置效果截图
外部CSS设置字体颜色实例截图
四、css字体颜色设置一段文字其中某些文字设置不同字体颜色
对一段红色文字中,其中一些字设置不同字体颜色color样式,一般使用span标签设置外部CSS样式设置不同颜色。
一段文字中一些字体设置不同CSS字体颜色实例如下:
1、CSS代码:
div{ color:#F00}
.expb{ color:#06F}
CSS代码解释:
div{ color:#F00}
对div内文字设置统一红色字体。
.expb{ color:#06F}
设置class=expb对应字体颜色为浅蓝色
2、HTML代码
<div>HTML8 我是<span class="expb">蓝色字体</span>测试文字</div>
3、完整实例HTML+CSS代码
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>字体颜色实例 HTML8</title>
<style>
div{ color:#F00}
.expb{ color:#06F}
</style>
</head>
<body>
<div>HTML8 我是<span class="expb">蓝色字体</span>测试文字</div>
</body>
</html>
4、字体颜色设置实例效果截图
设置一段文字中不同CSS字体颜色实例截图
五、div css文字字体颜色设置总结
不论哪种情况下对文字字体颜色设置,都是使用color样式单词来实现。颜色值设置时候注意“#”井号不要丢掉,否则设置字体颜色将失效无用。
关于DIV CSS字体颜色设置扩展阅读:
1、css字体颜色代码
2、div字体大小设置
3、css设置下划线颜色
4、css颜色单独设置