- id选择器 #myId
- 类选择器 .myClassName
- 标签选择器 div, h1, p
- 相邻选择器 p + span （ p元素后面第一个必须是 span 才起作用 ）
- 相邻选择器 p ~ span （在 p 元素后面与 p 元素同级的 span ）
- 后代选择器 div ul （ div 元素下面所有的ul，包括孙子节点 ul ）
- 子选择器 div > ul （ div 元素下面直接子级 ul，不包括孙子节点 ul ）
- 通配符 *
- 属性选择器 a[rel="external"]
- 伪类选择器
- nth-child .container span:nth-child(2){}
指的是类container下面的第二个元素是span的样式 - nth-of-type .container span:nth-of-type(2){}
指的是类container下面的span类型的第二个元素的样式
- nth-child .container span:nth-child(2){}
- 伪元素选择器
- ::after 用来创建一个伪元素
作为已选中元素的最后一个子元素。通常配合content属性来为该元素添加装饰内容。这个虚拟元素默认是行内元素。 - ::before 创建一个伪元素
其将成为匹配选中的元素的第一个子元素。常通过 content 属性来为一个元素添加修饰性的内容。此元素默认为行内元素。 - ::first-line
在某 block-level element （块级元素）的第一行应用样式。第一行的长度取决于很多因素，包括元素宽度，文档宽度和文本的文字大小 - ::first-letter
选中某 block-level element（块级元素）第一行的第一个字母，并且文字所处的行之前没有其他内容（如图片和内联的表格
- ::after 用来创建一个伪元素
伪元素 允许我们对选择元素的特定部分修改样式
可继承的属性：font-size font-family color opacity
不可继承的属性：border padding margin width height
优先级（就近原则）：!important > id > class > tag
!important比内联优先级高
