双标签:就是成对出现的,类似于这种 <html> </html>
单标签:就是可以单个使用的,类似于 <br> 换行标签 或 <hr>水平线标签。
标签的属性是用来定义文字或字符的 颜色、宽高、粗细、大小、等,这个是标签属性的作用。
1、每一个标签都有自己的属性,单标签和双标签都有。
2、一个标签可以有多个属性。
3、每个属性都有对应的值,值要用单或双引号引起来。
4、多个属性之间使用空格隔开。
5、属性没有顺序之分。
6、字体属性值,必须是系统可以识别的字体,一般为系统自带字体。
7、HTML5 中 font 属性已经弃用。
源代码:↓
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<!--网页抬头-->
<title>中央气象局</title>
</head>
<body>
<!--水平线的宽度是500像素,这个width就是标签属性-->
<hr width="500">
<!--下面这个是多个标签属性,多个属性之间用空格隔开-->
<font color="red" face="黑体" size="7">标签属性</font>
</body>
</html>
background-color 属性为元素定义了背景颜色:
<html> <body style="background-color:yellow"> <h2 style="background-color:red">This is a heading</h2> <p style="background-color:green">This is a paragraph.</p> </body> </html>
HTML样式:好看的颜色字体是有方法的
SS 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,也是今天才知道的。
今天就先到这里了,中午休息~
*请认真填写需求信息,我们会在24小时内与您取得联系。