css的编写需要针对某个标签或者某类标签或者某种标签来进行，当然我们也可以说元素，当标签不再是单纯的标签，它用于在网页中承载内容时，我们可以称它们为“元素”。
就像老师点名一样，老师可以说“所有的男生都站起来”，也可以说“所有姓陈的都站起来”，也可以说“邓某某”站起来，当然遇到重名的老师也可以说“第一列第三排邓某某”站起来。这里所有的点名方法都是为了有针对的选择某一类学生进行点名。
那么对于css装饰html元素而言，同理我们装饰html元素，也需要这样的“点名方法”来对某一类html元素进行装饰。而这样的点名方法，在css中，我们称之为“选择器”。不同的选择器及其组合能够使我们正确地选择我们想要装饰的元素。
问：那“选择器”都有哪些呢？
答：对于选择器类型而言，有标签选择器、class选择器、id选择器、属性选择器、伪类、伪元素；将不同的选择器组合起来的选择器，我们称之为“组合符选择器”，那它是用来说明选择器之间的关系。常见的组合符选择器有：后台选择器、子元素选择器、相邻兄弟选择器、普通兄弟选择器、分组选择器等。
问：这么多怎么知道要用哪些？
答：试一试就知道为什么需要这些选择器，无非就是为了选择到你想要选择的html元素。想想看，老师上课时点名点得那么精确不就是为了点到你吗？那个姓张的，爆炸发型的，上身穿棉袄下身穿短裤，脚上人字拖的同学给我站起来！
问：那这些怎么用啊？
答：快板打起来：老板发大财，生意做起来......
先把结构写好来：这里我们用外部css链接来写css，所以我们添加了link标签，文件为当前路径下index.css
可以看到现在没写css的效果
css样式书写规则：选择器加上{}，{}里面写我们的css属性，例如颜色、字体大小、宽高等等
1、标签选择器
标签就很熟悉了吧，像div,span,p,ul,input等这些前面学到的标签，它们的名字就可以做为选择器，故为标签选择器。
这里我们就将所有的div标签内容都变成了绿色，所有p标签内容都变成了橙红色，效果如下：
也就是说选择了div标签，那么所有的div标签都会被你操作到
2、class选择器
使用class选择器，你需要在标签上定义class属性。
如下图，这里我在div标签上定义了class属性，它的值为topic。我们的属性值可以语义化一点，就是明确这个标签内容是用来做什么的。
这样我们就可以通过class选择器来操作这个标签下的内容。如下图，我给它添加了一个24px的字体大小。我们要给这个class选择器添加样式时，需要在class名前面加上“.”这个符号，代表这是一个类选择器。
效果图
然后，如果我们给第一个p标签也加上这个class呢？
效果图
可以看到，加上了class="topic"的p标签，它的内容字体也变大了。也就是说，class属性是可以重复的，可以给多个标签添加相同的class。接下来讲的id选择器是就不可以重复，整个html文档只能有一个。
3、id选择器
使用id选择器，你需要在标签上定义id属性。
这样我们就可以通过id选择器来操作这个标签下的内容。如下图，我给字体添加紫色并且加粗。我们要给这个id选择器添加样式时，需要在id名前面加上“#”这个符号，代表这是一个id选择器。
效果图
注意：上面也说过了，id选择器是不能重复的，整个html文档只能有一个。
接下来，我们看看重复了会这么样。
效果图
那么你就会说了，这不是也可以吗，样式都出来了啊，怎么回事？？
样式确实是能作用上，但是我们无论给元素添加id、class或者其他的，都是为了能过操作它。css操作它能够更改样式，那么js也是能够操作它来动态更改样式或者其它的一些交互行为。那么js来选择这个id为