Perbedaan Selector ID dan Class pada HTML dan CSS

Setelah lama tidak menulis artikel di blog ini, saya akan membahas tentang perbedaan ID dan Class pada HTML maupun CSS. Namun sebelum mas vroh lanjut, pastikan mas vroh tau dulu tentang HTML atau CSS, saya belum menulis tentang HTML dan CSS, tapi nanti akan saya share juga. Daripada lupa, dipending mulu.

Nah dalam HTML, ada yang namanya selector. Ada yang sudah default, yaitu bawaan dari si empu pembuat & pengembangnya. Namun mas vroh bisa membuat selector sendiri. Ada dua jenis pada HTML, yaitu  ID dan Class.

Simak video berikut sebagai pembuka

Selector ID

selector ID ini merupakan selector untuk menentukan bagian yang hanya ada satu pada halaman dan juga menentukan style nya. Jadi selector ID ini tidak bisa dipanggil lebih dari satu. Jika ada dua, maka hanya bekerja pada bagian pertama saja. selector ini juga bisa untuk me link pada section dalam satu halaman, misalnya kalau mas vroh men klik navigasi dengan selector id=“contact” , maka mas vroh akan dibawa ke section contact pada satu halaman. Bisa dengan effect scroll ataupun fade tergantung dari developernya. selector ID dituliskan dengan awalan pagar atau sharp atau kres “#” pada css. Untuk HTML nya menggunakan id=“namaID” .

Contoh penggunaan selector ID

Pada HTML

Sebuah paragraf dengan content sebagai selector ID.

Pada CSS

Selector Class

Selector class juga digunakan untuk menentukan style juga sama seperti id. Bedanya adalah jika id hanya boleh dipanggil satu kali saja, class bisa dipanggil berkali kali pada satu halaman. Selector ini ditulis dengan awalan titik atau dot “.” pada css dan class=“nama-class” pada HTML. oh iya, dalam satu element juga bisa dipanggil untuk beberapa class, spasi sebagai pemisah.

Contoh penguin selector Class

Pada HTML

 Contoh diatas, memanggil dua class sekaligus, yaitu container dan center-content.

Pada CSS

Nah, untuk kegunaan kenapa memanggil  lebih dari dua class pada satu element yaitu, biar ga cape cape nulis lagi. jadi tinggal digabungin classnya.

Demikian sekilas info tentang selector ID dan Class pada HTML dan CSS. Terimakasih sudah sudi mampir. bye..