Belajar CSS : Mengenal Jenis-Jenis Selector Dasar CSS (5) - Suka Code

Cascading Style Sheets atau yang sering disebut CSS adalah aturan dalam pembuatan web yang mengatur komponen yang ada, sehingga akan lebih terstruktur. Dengan CSS kita bisa mengatur semua komponen yang ada misalnya warna, posisi komponen, jarak antar komponen dan masih banyak lagi. CSS sendiri terdiri dari beberapa macam jenis selector yang sering digunakan; di antara nya:

• Selector tag

Selector tag menggunakan fungsi html untuk diberikan efek css, misalnya p{}. li{}.

• Selector class

Selector class ini bisa digunakan dalam tag yang berbeda yang artinya selector ini bisa digunakan hingga berulang-ulang kali, selector ini ditandai dengan titik (.) sebelum nama selector contoh .class.

• Selector id

Selector id hampir sama memiliki konsep yang sama dengan selector class, namun yang membedakan disini ialah hanya bisa di panggil satu kali saja, selector ini ditandai dengan tanda pagar (#) sebelum nama selector. Contoh #id.

• Selector pseudo class

Selector ini biasanya digunakan untuk mengatur atribut suatu tag, misalnya saja untuk mengatur anchor (a). Macam selector ini ada :hover, :link, :visited, :active.

 

• Selector pseudo elemen

Selector ini digunakan untuk memberikan efek menarik, misalnya saja,

:first-letter, :first-line, :first-child.

• Selector keturunan

Selector ini digunakan untuk suatu keturunan di HTML,

contohnya <ul> <li> </li> <li> </li> </ul>.

• Selector orang tua anak

Selector ini diberlakukan hanya untuk keturunan pertamanya saja dan tidak berlaku untuk keturunan kedua.

• Selector atribut

Selector ini digunakan untuk memilih tag yang yang mana saja yang ingin diberi efek dengan CSS.

• Selector berdekatan 

Selector ini digunakan untuk mengatur elemen yang berdekatan dengan lainnya, dan dilambangkan dengan tanda (+).

 

• Selector gabungan 

Selector ini digunakan untuk menggabungkan beberapa tag agar bisa diberi efek yang sama, dan dilambangkan dengan (,).

• Selector universal

Selector ini ditujukan untuk semua elemen HTML, dan dilambangkan dengan (*).

Muhammad Ridwan

Suka Code Blog adalah website dengan kumpulan konten seputar Game Development, Web Programming, Android Programming, Windows Programming, dan lain-lain.

Bagikan Artikel ini