Selector atau pemilih CSS digunakan untuk menentukan elemen HTML yang akan di-style atau diformat.

Selektor CSS atau pemilih CSS bisa dibagi menjadi 5 kelompok yaitu:

1. Pemilih sederhana yaitu memilih elemen berdasarkan nama, id, dan kelas.
2. Pemilih kombinasi yaitu memilih elemen berdasarkan hubungan spesifik.
3. Pemilih pseudo-class yaitu memilih elemen berdasarkan kondisi tertentu.
4. Pemilih pseudo-elemen yaitu memilih elemen berdasarkan bagian dari elemen.
5. Pemilih atribut yaitu memilih elemen berdasarkan atribut.

Pemilihan nama elemen CSS

Pemilihan nama elemen CSS yaitu dengan memilih elemen HTML berdasarkan nama elemen.

Contoh di bawah ini membuat semua elemen <p> paragraf menjadi rata tengah dengan warna teks kuning.

p {
      text-align: center;
      color: yellow;
}

Pemilihan id CSS

Pemilihan id adalah memilih elemen HTML berdasarkan atribut id dari elemen HTML.
Atribut id pada elemen HTML ini adalah unik pada sebuah halaman HTML, jadi hanya ada satu id pada sebuah dokumen HTML.
Untuk memilih sebuah elemen dengan id harus menggunakan karakter pagar (#) diikuti dengan id dari elemen HTML. Nama id tidak boleh dimulai dengan angka.

Contoh di bawah ini, aturan CSS akan diterapkan pada id dengan nama "satu".

#satu {
    text-align: center;
    color: yellow;
}

Pemilihan kelas CSS

Pemilihan kelas adalah untuk memilih elemen HTML berdasarkan atribut nama kelas.
Untuk memilih elemen dengan nama kelas yaitu dengan karakter titik (.) dan diikuti dengan nama kelas.
Berbeda dengan id, kelas boleh digunakan pada lebih dari satu elemen HTML.

Contoh di bawah ini memilih semua elemen HTML dengan nama kelas "kiri".

.kiri {
    text-align: center;
    color: yellow;
}

Pemilihan Kelas CSS juga bisa diterapkan pada elemen HTML seperti pada contoh di bawah ini.

p.kiri {
     text-align: center;
     color: yellow;
}

Sedangkan pada halaman HTML penerapan kelas pada elemen HTML ditulis seperti ini:

<p class="kiri">Contoh penulisan nama kelas CSS pada elemen HTML</p>

Pemilih universal CSS

Pemilih universal CSS yaitu (*) akan memilih semua elemen HTML pada sebuah dokumen atau halaman.

Pada contoh di bawah ini aturan CSS akan diterapkan pada semua elemen HTML.

* {
   text-align: left;
   color: red;
}

Penulisan CSS untuk grup

Penulisan aturan CSS untuk grup dilakukan untuk elemen HTML yang memiliki aturan CSS yang sama. Untuk lebih jelasnya perhatikan contoh berikut.

h1 {
   text-align: center;
   color: blue;
}

h2 {
   text-align: center;
   color: blue;
}

p {
   text-align: center;
   color: blue;
}

Karena elemen h1, h2, dan p memiliki aturan CSS yang sama maka penulisannya bisa mengunakan grup untuk menyederhanakan penulisan dan meminimalkan kode.

h1, h2, p {
   text-align: center;
   color: blue;
}