Cara Menambahkan Atribut ke Tag HTML

click fraud protection

Bahasa HTML mencakup sejumlah elemen. Ini termasuk yang biasa digunakan komponen situs web seperti paragraf, heading, link, dan gambar. Ada juga sejumlah elemen baru yang diperkenalkan dengan HTML5, termasuk header, nav, footer, dan banyak lagi. Semua elemen HTML ini digunakan untuk membuat struktur dokumen dan memberinya makna. Untuk menambahkan lebih banyak makna pada elemen, Anda dapat memberi mereka atribut.

Tag pembuka HTML dasar dimulai dengan karakter <. itu diikuti dengan nama tag dan akhirnya anda melengkapi karakter>. Misalnya, tag paragraf pembuka akan ditulis seperti ini:

Untuk menambahkan atribut ke. Anda tag HTML, Anda terlebih dahulu meletakkan spasi setelah nama tag (dalam hal ini adalah "p"). Kemudian Anda akan menambahkan nama atribut yang ingin Anda gunakan diikuti dengan tanda sama dengan. Akhirnya, nilai atribut akan ditempatkan dalam tanda kutip. Sebagai contoh:


Tag dapat memiliki beberapa atribut. Anda akan memisahkan setiap atribut dari yang lain dengan spasi.


Elemen Dengan Atribut yang Diperlukan

Beberapa elemen HTML sebenarnya memerlukan atribut jika Anda ingin mereka berfungsi sebagaimana dimaksud. Elemen gambar dan elemen tautan adalah dua contohnya.

instagram viewer

Itu elemen gambar membutuhkan atribut "src". Atribut itu memberi tahu browser gambar mana yang ingin Anda gunakan di lokasi itu. Nilai atribut akan menjadi jalur file ke gambar. Sebagai contoh:

logo perusahaan kami

Anda akan melihat bahwa kami menambahkan atribut lain ke elemen ini, atribut "alt" atau teks alternatif. Ini secara teknis bukan atribut yang diperlukan untuk gambar, tetapi merupakan praktik terbaik untuk selalu menyertakan konten ini untuk aksesibilitas. Teks yang tercantum dalam nilai atribut alt adalah apa yang akan ditampilkan jika gambar gagal dimuat untuk beberapa alasan.

Elemen lain yang membutuhkan atribut khusus adalah anchor atau tag tautan. Elemen ini harus menyertakan atribut "href", yang merupakan singkatan dari 'hypertext reference'. Itu adalah cara yang bagus untuk mengatakan "di mana tautan ini harus pergi." Sama seperti elemen gambar yang perlu mengetahui gambar mana yang akan dimuat, tag tautan harus tahu di mana seharusnya suka untuk. Berikut adalah tampilan tag tautan:


Tautan itu sekarang akan membawa seseorang ke situs web yang ditentukan dalam nilai atribut. Dalam hal ini, ini adalah halaman utama Dotdash.

Atribut sebagai Kait CSS

Penggunaan atribut lainnya adalah ketika mereka digunakan sebagai "pengait" untuk gaya CSS. Karena standar web menentukan bahwa Anda harus memisahkan struktur halaman (HTML) dari gayanya (CSS), Anda menggunakan kait atribut ini di CSS untuk menentukan bagaimana halaman terstruktur akan ditampilkan di web peramban. Misalnya, Anda dapat memiliki bagian markup ini di dokumen HTML Anda.


Jika Anda ingin divisi itu memiliki warna latar belakang hitam (#000) dan ukuran font 1,5em, Anda harus menambahkan ini ke CSS Anda:

.featured { warna latar: #000; ukuran font: 1.5em;}

Atribut kelas "unggulan" bertindak sebagai pengait yang kita gunakan di CSS untuk menerapkan gaya ke area itu. Kami juga dapat menggunakan atribut ID di sini jika kami mau. Kelas dan ID adalah atribut universal, yang berarti mereka dapat ditambahkan ke elemen apa pun. Keduanya juga dapat ditargetkan dengan gaya CSS tertentu untuk menentukan tampilan visual elemen tersebut.

Tentang Javascript

Terakhir, menggunakan atribut pada elemen HTML tertentu juga merupakan sesuatu yang mungkin Anda gunakan dalam Javascript. Jika Anda memiliki skrip yang mencari elemen dengan atribut ID tertentu, itu adalah penggunaan lain dari bahasa HTML yang umum ini.

instagram story viewer