CSS优先级、CSS选择器、编写CSS时的注意事项

CSS的优先级：

内嵌样式>ID选择器>类选择器>标签选择器

内部样式>内部样式>外部样式

CSS的选择器：

选择器：在 CSS 中，选择器是一种模式，用于选择需要添加样式的元素。

1、基本选择器（如下：）：

ID选择器：根据标签ID设置标签的样式(例如：#div1{height:100px;})，通常用来设置划分区间使用。

类选择器：根据标签的类设置标签的样式(例如：.div1{height:100px;})，通常用于设置不同标签却有相同样式。

标签选择器：根据标签名设置标签的样式(例如：div{height:100px;})，通常用于当前盒子内的同一标签名的同一样式。

2、通配符选择器

通配符选择器：使用通配符(*)设置标签的样式(例如：*{height:100px;})，使用本选择器会设置所有元素的样式，通常用于消除默认样式(例如：*{margin:0px;padding:0px;)。

3、属性选择器

属性选择器：用于设置含有该 属性-值 的标签的样式(例如：div[name=BT]{height:100px;})，通常用于区分盒子内相同标签名但是属性值不一样的标签。

4、结构伪类选择器

结构伪类选择器：用于设置不同状态或者不同子元素的样式(例如：:after、:before、:focus、:link、:visited、:hover、:active、nth-child()、nth-of-type()等)。

5、层次选择器

后代选择器：为当前元素的所有后代的特定标签设置样式，格式：父元素+空格+后代元素(例如：div div{height:100px;})。

子代选择器：为当前元素的特有子代的特有标签设置样式，格式：父元素+大于号+后代元素(例如：div>div{height:100px;})。

通用兄弟选择器：为当前元素的后面的所有指定兄弟标签设置样式，格式：父元素+波浪线+后代元素(例如：div~div{height:100px;})。

　　　　　　　　注意事项：如果后面的所有指定兄弟标签的标签名不为指定标签名(例如：html代码：<div></div><div></div>css代码：div~p{height:100px;})，则设置失败。

相邻兄弟选择器：为当前元素的下一个指定的兄弟标签设置样式，格式：父元素+加号+后代元素(例如：div+div{height:100px;})。

　　　　　　　　注意事项：如果下一个标签名不为指定标签名(例如：html代码：<div></div><div></div>css代码：div+p{height:100px;})，则设置失败。

CSS的注意事项：

设置CSS时需要注意一下注意事项：

①需要注意CSS的优先级

②不要让别人设置自己的样式，除非是通用样式。(兄弟或者爸爸给你设置的样式不能被清除。就像别人想打你，你却不能让他停，你自己打自己，你却可以收手。)

③使用超链接结构伪类选择器的时候，必须按照link->visited->hover->active的顺序，不然会有BUG。