Zona Internet Saya 29 November 2018
Belajar Memahami Fungsi Atribut Class dan Id pada HTML. Atribut class dan id adalah atribut yang digunakan untuk menyediakan pemilih atau penanda yang berfungsi untuk memudahkan kita memilih tag tertentu dan memanipulasinya dalam file css dan javascript. Bila menggunakan atribut id pada tag html, maka pada css harus menggunakan tag "#" sedangkan untuk atribut class pada html harus menggunakan tanda titik ". " untuk memanggilnya
Dalam penggunaan atribut id dan class terdapat sedikit perbedaan yaitu dimana atribut id hanya dapat digunakan untuk satu elemen html, biasanya atribut ini digunakan pada tag html kemasan seperti header, nav, main, sidebar, dan footer. Sedangkan atribut class dapat digunakan pada banyak tag html dan dapat disebut secara keseluruhan, biasanya digunakan sebagai content pada tag html, seperti ul, ol, div dan lain-lain. Jika belum paham maka Anda bisa melihat contoh penggunaan atribut class dan id sebagai berikut
Memahami Fungsi Atribut Id Dan Class
#kotak_pembungkus{display:block;background:blue;margin:0 auto;width:370px}
.kotak{display:inline-block;width:100px;height:100px;margin:10px;text-align:center;background:red;line-height:100px;color:#fff}
Kotak 1
Kotak 2
Kotak 3
Dan inilah hasilnya, semua kotak merah berada di dalam area kotak biru
Baca juga
Cara Menyisipkan Gambar di Web Dengan HTML
Cara Membuat Berbagai Jenis Hyperlink HTML di Web
Menyesuaikan Posisi Paragraf Dengan HTML Dan CSS
Lalu bagaimana cara mengubah warna kotak nomor 2 menjadi hijau?
Memahami Fungsi Atribut Id Dan Class
#kotak_pembungkus{display:block;background:blue;margin:0 auto;width:370px}
.kotak{display:inline-block;width:100px;height:100px;margin:10px;text-align:center;background:red;line-height:100px;color:#fff}
/* CSS baru harus di bawah CSS utama */
.hijau{background:green;color:yellow}
Kotak 1\
Kotak 2
Kotak 3
_Itulah penjelasan tentang Mengetahui Fungsi Atribut Dan Nilai Pada Class Dan Id Pada HTML
Baca juga
Mengatur Tajuk dan Format Teks Web Menggunakan HTML
Tutorial Membuat Tabel Di Web Dengan HTML
Berbagai Tag HTML Beserta Fungsi Dan Contohnya
BAGIKAN
Sebelumnya
« Posting Sebelumnya
Lanjut
Posting Selanjutnya »
Atribut Id dan class pada html berguna untuk memberi nama atribut pada elemen html. Penggunaan utama
Diperbarui. 18 Oktober 2020
Id dan Class merupakan salah satu atribut dalam HTML yang berguna untuk memberi nama atribut pada elemen HTML. Atribut id harus unik alias tidak boleh sama dengan yang lain sedangkan atribut class bisa di-assign ke banyak elemen. Atribut id dan class sangat berguna jika ingin berinteraksi dengan css, javascript dan bahasa server-side seperti Php
Cara pemanggilan atribut id sendiri diawali dengan simbol pagar [ #
] diikuti dengan nama atribut dan class atribut itu sendiri diawali dengan tanda titik [ .
] diikuti dengan nama atribut
Contoh
Judul postHallo semuanya!
Sampai jumpa!
Sampai ketemu dilain waktu!
Pada contoh di atas, kita membuat paragraf dengan atribut id bernama teks-sambutan
dan membuat paragraf dengan atribut class bernama teks-penutup
. Sekilas contoh di atas hanya membuat sebuah paragraf. Silahkan lihat contoh di bawah ini agar tidak bingung
Contoh atribut id dan class untuk CSS
Judul post #teks-sambutan { color: yellow; background-color: blue; } .teks-penutup { color: red; background-color: yellow; }Hallo semuanya!
Sampai jumpa!
Sampai ketemu dilain waktu!
Hasil
Halo semuanya
Sampai ditemukan
Sampai jumpa lain waktu
Kami menggunakan atribut id dan class untuk menyediakan acara Javascript. Javascript sendiri merupakan salah satu bahasa pemrograman yang berjalan di sisi client