Penggunaan Selektor ID dan CLASS

Terdapat beberapa perbedaan antara selektor class dan id, diantaranya :

1. Format Penilisan

ID Selector diawali dengan simbol # (pagar) dan pemanggilan di HTML menggunakan format id  

Class Selector  diawali dengan simbol . (titik) dan pemanggilan di HTML menggunakan format class

Contoh :

Penulisan ID

#judul {

background :#320731;

color :#FFFFFF;

border:3px dashed #F0C0D0;

border-radius:30px 30px 30px 30px;

}

Pemanggilan ID

<div id:"judul">CSS ID</div>

Penulisan CLASS

.judul {

background :#320731;

color :#FFFFFF;

border:3px dashed #F0C0D0;

border-radius:30px 30px 30px 30px;

}

Pemanggilan CLASS

<div class:"judul">CSS CLASS</div>

2. Banyaknya Pemanggilan

ID Selector pemanggilan hanya bisa digunakan satu kali saja untuk satu Tag HTML. Dikarenakan bersifat unik

Class Selector pemanggilan bisa digunakan lebih dari satu kali di dalam Tag HTML nya. Keuntungan menggunakan Class selector ini adalah kita tidak perlu membuat banyak properti Style yang sama berulang-ulang dalam CSS

Contoh :

Penulisan ID

#judul {

background :#320731;

color :#FFFFFF;

border:3px dashed #F0C0D0;

border-radius:30px 30px 30px 30px;

}

Pemanggilan ID

<div id:"judul">CSS ID</div>

Penulisan CLASS

.judul {

background :#320731;

color :#FFFFFF;

border:3px dashed #F0C0D0;

border-radius:30px 30px 30px 30px;

}

.judul2 {

font-size:25px;

}

Pemanggilan CLASS

<div class:"judul judul2">CSS CLASS</div>