HTML标签的内容和样式的分离

HTML内容

HTML包括：

1.文档类型声明

2.标签

HTML标签的内容和样式的分离

以前

以前标签里又写内容又写样式(style)，问题1：内容、样式不分离，问题2：重复代码很多。如下一行所示：

<标签名 属性 属性 属性> style属性="样式名:值;样式名:值;" 

标签的属性里既有样式属性，也有别的属性。那么可以写一个样式标签，里面用选择器把样式框起来。如下：现在部分所示。 

现在

引用css样式（只有标签选择器的话），结果引用部分样式全都一样。想有的灰，有的红，就给body标签里加上class取名(class="note"）给他加上分类属性。 在标题部分就可以多复制一个段落的标签选择器改成红色，（大括号前带点的为分类，没点的是原来那种标签），然后改名成类选择器的名字就好了。

如下：由第一份代码变成第二份

第一份代码：
<style>是标签
里面的a和p是链接和段落，都是标签选择器
a{
color:XXXX;
font-size:14px;
}
p{
color:grey;
}
}
</style>

复制两个p标签选择器，然后改成类选择器。

第二份代码：
<style>是标签
里面的没带点的a是标签选择器，带点的note和time是类选择器，一个类叫note，一个类叫time
a{
color:XXXX;
font-size:14px;
}
.note{
color:grey;
}
.time{
color:red;
}
}
</style>

没有点的是标签，有点的是分类。

 学会在上面写样式之后，就把body里写的样式（比如width）删掉，写在上面style样式里，在body的标签里就只写内容了。