Jago Belajar html : Id Dan Class Pada html

Sebelumnya sudah saya katakan bahwa pada pelajaran jago html selanjutnya kamu akan belajar mengenai id dan class pada html yang berguna sebagai pemilih suatu tag atau pengenal untuk melakukan perubahan pada tag html menggunakan css external maupun internal.

Perbedaan atribut id dan class html

id pada html

Atribut id merupakan atribut yang nilainya hanya boleh dimiliki oleh 1 tag html saja, jadi nilai dari atribut id ini tidak boleh sama dengan nilai atribut id lainnya karena penggunaan atribut id adalah untuk mengkhususkan suatu tag html agar berbeda dengan yang lainnya, jika kamu coba menyamakan tag id dengan nilai yang sama, maka html akan dapat terus dijalankan namun hal ini salah karena kegunaan dari atribut id adalah untuk membedakan tag html dengan tag lainnya.

class pada html.

Berbeda dengan atribut id yang nilainya tidak boleh sama, atribut class membolehkan nilai dari satu atribut class dengan atribut class lainnya sama.

Perbedaan tanda css id dan class 

Tanda css id

Untuk melakukan perubahan css pada tag yang memiliki atribut id caranya adalah dengan mengetikan #namaid pada struktur <style> atau file css. Saya akan menggunakan tag div yang merupakan tag untuk membagi bagian pada html sebagai contoh penggunaan atribut id, kita akan mempelajari tag div pada pembelajaran selanjutnya. 

Tanda css class

Untuk memilih atribut class pada css caranya adalah dengan mengetikkan .namaclass pada struktur <style> atau file css.

Untuk penggunaan atribut class dan id bisa dilihat pada gambar dibawah ini.

file html

hasilnya

Dokumen html diatas menjelaskan bahwa semua nilai div class yang bernilai warna akan memiliki background warna hijau dan font berwarna putih, sedangkan div yang memiliki nilai id bernama bedawarna akan memiliki background berwarna merah dan font berwarna putih, jadi kegunaan dari atribut class adalah untuk melakukan perubahan terhadap banyak tag html, sedangkan atribut id digunakan untuk melakukan perubahan terhadap 1 tag html saja.

Selesai sudah pembahasan id dan class pada html, semoga kamu dapat memahami fungsi dari atribut id dan class, sampai jumpa di jago belajar html selanjutnya ! 😀