1、标签选择器

基本语法


为div加入样式

2、类选择器

基本语法


.content{
css 样式
}
class 选择器以 “.” 来定义，class 属性可以HTML 文档中出现多次。

3、id选择器

基本语法


#content{
css 样式
}

id 选择器以 “#” 来定义，id 属性只能在HTML 文档中出现一次。

4、通配符选择器

用“*”号表示，他是所有选择器作用范围最广的，能匹配页面中所有的元素（能作用于所有的标签）

  1. *{
  2.     margin:0;        //定义外边距
  3.     padding:0;    //定义内边距
  4. }

5、标签指定选择器

又称交集选择器，由两个选择器构成，其中一个为标签选择器，第二个为class选择器或者id选择器，两个选择器之间不能有空格，如h3.special或p#one

  1. <h3 class="special"></h3>
  2. <p id="one"></p>

6、后代选择器（派生选择器）

后代选择器用来选择元素或元素组的后代，其语法就是把外层标记写在前面，内层标记写在后面，中间用空格分隔。当标记发生嵌套时，内层标记就成为外层标记的后代

  1. p font{
  2.   color:red;
  3.   }
  4. <p><font>wo</font></p>

7、交集选择器

交集选择器是由各个选择器连接而的，任何形式的选择器都可以作为并集选择器的一部分,书写时逗号分隔

  1. h2,.special,#one{
  3. }
  4. <h2></h2>
  5. <p class="special"></p>
  6. <p id="one"></p>

8、选择器优先级

当两个规则都作用到了同一个html元素上时，如果定义的属性有冲突，那么应该用谁的值的，CSS有一套优先级的定义。

不同级别

1、在属性后面使用 !important 会覆盖页面内任何位置定义的元素样式。
2、作为style属性写在元素内的样式
3、id选择器
4、类选择器
5、标签选择器
6、通配符选择器
7、浏览器自定义或继承
总结排序：!important > 行内样式(style属性)>ID选择器 > 类选择器 > 标签 > 通配符 > 继承 > 浏览器默认属性
同一级别中后写的会覆盖先写的样式。