🔎 Selector Dasar (Class & ID)

Selector dalam CSS itu ibarat cara kita “menunjuk” elemen mana yang mau dikasih gaya. Nah, dua selector yang paling sering dipakai adalah:

📘 Selector Class (.)

Class selector dipakai kalau kita mau kasih style ke beberapa elemen sekaligus. Kita tandai dengan titik (.) di depan nama class. Misalnya .kotak berarti semua elemen yang punya class="kotak" akan kena style itu. Cocok buat gaya yang dipakai berulang-ulang.

style.css

.kotak {
  background-color: lightblue;
  padding: 10px;
}

index.html

<div class="kotak">Saya punya class 'kotak'</div>

🆔 Selector ID (#)

ID selector: dipakai kalau kita mau styling satu elemen yang unik aja. Ditandai dengan tanda pagar (#). Misalnya #judul berarti cuma elemen dengan id="judul" yang akan dapat style itu. ID ini cuma boleh dipakai sekali di satu halaman.

style.css

#judul {
  color: crimson;
  font-weight: bold;
}

index.html

<h1 id="judul">Ini Judul Utama</h1>

⚙️ Demo Interaktif:

💡 Tips: Gunakan class untuk style berulang dan id untuk elemen yang unik.