1. css元素选择器 ``` 文档的元素就是最基本的选择器 p{color:pink} ``` 2. class选择器 ``` test{color:yellow} ``` 3. id选择器 ``` #first{color:blue} ``` 4. 分组选择器 ``` p,h4{background:gray} ``` 5. 后代选择器 ``` div>span{} //取div所有子元素为span的标签 ``` 6. 兄弟选择器 ``` div+p{}选取紧邻div之后的第一个兄弟元素 div~p{}选取紧邻div之后的所有兄弟元素 ``` 7. 伪类选择器，表示的是一个状态 ``` div:hover{} input:focus{} :focus 选择器用于选取获得焦点的元素。 提示：接收键盘事件或其他用户输入的元素都允许 :focus 选择器。 如Input输入框点击后背景变色 ``` 8. 伪元素 ``` ":before" 伪元素可以在元素的内容前面插入新内容 ":after" ```