CSS Text(文本)属性可定义文本的外观，比如文本的颜色、对齐文本、装饰文本、文本缩进、行间距等。
用的最多的就是文本颜色，color属性用于定义文本的颜色。语法如下:
div {
color:red;
}
颜色的表现形式有:
预定义的颜色值: red、green、pink等
十六进制: #FF0000、#FF6600、#29D794等
RGB代码: rgb(255,0,0)或rgb(100%,0%,0%)等
看下效果:
对应的代码为：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
div {
color: blue;
}
</style>
</head>
<body>
<div>人保说的是还有7次洗车，5次还是3次道路救援啥的</div>
</body>
</html>
所有div对应的都为蓝色。
使用第二种方法，16进制颜色来表示,先看下效果:
对应代码为:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
/* div {
color: blue;
} */
div {
color: #FF0000;
}
</style>
</head>
<body>
<div>人保说的是还有7次洗车，5次还是3次道路救援啥的</div>
</body>
</html>
最后使用第三种方法，看下效果:
对应的代码为:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
/* div {
color: blue;
} */
/* div {
color: #FF0000;
} */
div {
color: rgb(255, 193, 100);
}
</style>
</head>
<body>
<div>人保说的是还有7次洗车，5次还是3次道路救援啥的</div>
</body>
</html>
rgb竟然是red、green、blue，也是今天才知道的。
今天就先到这里了，中午休息~
文章为用户上传，仅供非商业浏览。发布者：Lomu，转转请注明出处： https://www.daogebangong.com/articles/detail/Test%20and%20development%20full%20stackHTML%2012%20css%20font%20color%20attribute.html
支付宝扫一扫 
评论列表（196条）
测试