| Selector | Kegunaan | Contoh |
| Universal Selector | Diaplikasikan pada semua elemen dalam dokumen HTML | *{} akan menarget semua elemen dalam halaman |
| Type Selector | Sesuai dengan nama elemen | h1, h2, h3 {} Targetnya adalah elemen <h1>,<h2>,dan <h3> |
| Class Selector | Sesuai dengan elemen yang memiliki atribut class dimana nama atributnya dituliskan setelah tanda . | note{} menarget semua elemen dengan atribut class yang value-nya berisi “note” |
| ID Selector | Mengatur style pada elemen yang memiliki atribut id dimana value nya sesuai dengan yang dituliskan setelah tanda “#” | #isi{} menarget elemen yang memiliki atribut id yang valuenya berisi “isi”. Misal <div id=”isi”> |
| Child Selector | Mengatur style elemen yang merupakan “anak” atau sub elemen yang lain | li>a {} menarget setiap elemen <a> yang merupakan anak dari element <li>. Akan tetapi tidak untuk semua elemen <a> yang berada dalam satu halaman |
| Descendant Selector | Mengatur style pada sebuah elemen yang merupakan turunan dari elemen lain yang dispesifikasikan | p a {} menarget elemen <a> yang berada dalam elemen <p>, meskipun ada elemen lain yang berada didalamnya. |
| Adjacent Sibling Selector | Mengatur elemen yang merupakan elemen yang muncul pertama kali setelah elemen yang ditentukan | h1+p {} menarget elemen <p> yang muncul pertama kali setelah elemen <h1> dan tidak berlaku bagi elemen <p> yang lain |
| General Sibling Selector | Mengatur elemen yang merupakan “saudara kandung” atau muncul setelah elemen yang dimaksud | h1~p {} apabila ada dua elemen <p> yang muncul setelah elemen <h1>, maka keduanya akan terkena efek pengaturan style ini. |
0 komentar:
Posting Komentar