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" ```