CSS選擇符

記錄一下css選擇器使用方法

1. 類選擇器(.)

   .box {}

2. id選擇器(#)

   #box {}

3. 標籤選擇器

   div {}

4. 屬性選擇器

   input['text']

5. 後代選擇器(空格)

   // html
   <div class="container">
         <ul class="list">
       <li class="item">1</li>
       <li class="item">2</li>
       <li class="item">3</li>
         </ul>
   </div>
   
   // css
   // 後代選擇器
   .container .list {}

6. 子代選擇器(>)

   // 代碼同上
   .container > .list {}

7. 相鄰選擇器(~)

   .item ~ .item {}

8. 兄弟選擇器(+)

   .item + .item {}

9. 通配符選擇器(*)

   * {}

10. 僞類選擇器

    .item:hover {}
    .item:nth-child {}