Atribut memberikan informasi tambahan tentang elemen HTML.
Atribut HTML
- Semua elemen HTML dapat memiliki atribut
- Atribut memberikan informasi tambahan tentang elemen
- Atribut selalu ditentukan dalam tag awal
- Atribut biasanya datang dalam pasangan nama / nilai seperti: name = "value"
Href Atribut
Link HTML didefinisikan dengan
<a>tag. Alamat link ditentukan dalam hrefatribut:Contoh
<a href="https://www.w3schools.com">This is a link</a>
Anda akan belajar lebih banyak tentang link dan
<a>tag nanti dalam tutorial ini.The src Atribut
Gambar HTML didefinisikan dengan
<img>tag.
Nama file dari sumber gambar ditentukan dalam
srcatribut:Contoh
<img src="img_girl.jpg">
Lebar dan tinggi Atribut
Gambar HTML juga memiliki
widthdan heightatribut, yang menentukan lebar dan tinggi dari gambar:Contoh
<img src="img_girl.jpg" width="500" height="600">
Lebar dan tinggi yang ditentukan dalam pixel secara default; sehingga width = "500" berarti lebar 500 piksel.
Alt Atribut
The
altAtribut menentukan sebuah teks alternatif yang akan digunakan, jika gambar tidak dapat ditampilkan.
Nilai dari
altatribut dapat dibaca oleh pembaca layar. Cara ini, seseorang "mendengarkan" untuk halaman web, misalnya gangguan penglihatan orang, bisa "mendengar" elemen.Contoh
<img src="img_girl.jpg" alt="Girl with a jacket">
The
altatribut juga berguna jika gambar tidak dapat ditampilkan (misalnya jika tidak ada):Contoh
Lihat apa yang terjadi jika kita mencoba untuk menampilkan gambar yang tidak ada:
<img src="img_typo.jpg" alt="Girl with a jacket">
Gaya Atribut
The
styleatribut digunakan untuk menentukan styling dari unsur, seperti warna, font, ukuran dllContoh
<p style="color:red">This is a red paragraph.</p>
Anda akan belajar lebih banyak tentang styling kemudian dalam tutorial ini, dan di kami CSS Tutorial .
The lang Atribut
Bahasa dokumen dapat dinyatakan dalam
<html>tag.
Bahasa dinyatakan dengan
langatribut.
Mendeklarasikan bahasa adalah penting untuk aplikasi aksesibilitas (pembaca layar) dan mesin pencari:
<!DOCTYPE html>
<html lang="en-US">
<body>
...
</body>
</html>
Dua huruf pertama menentukan bahasa (en). Jika ada dialek, menambahkan dua huruf lebih (AS).
Judul Atribut
Di sini, sebuah
titleatribut ditambahkan ke <p> elemen. Nilai dari atribut judul akan ditampilkan sebagai tooltip ketika Anda mengarahkan mouse ayat:Contoh
<p title="I'm a tooltip">
This is a paragraph.
</p>
Kami Sarankan: Gunakan huruf kecil Atribut
Standar HTML5 tidak memerlukan nama atribut huruf kecil.
Atribut judul dapat ditulis dengan huruf besar atau huruf kecil seperti judul atau TITLE .
W3C merekomendasikan huruf kecil di HTML, dan tuntutan huruf kecil untuk jenis dokumen ketat seperti XHTML.
Di W3Schools kita selalu menggunakan nama atribut huruf kecil.
Kami Sarankan: Nilai Penawaran Atribut
Standar HTML5 tidak memerlukan tanda kutip di nilai atribut.
The
hrefatribut, ditunjukkan di atas, dapat ditulis tanpa tanda kutip:Buruk
<a href=https://www.w3schools.com>
Baik
<a href="https://www.w3schools.com">
W3C menganjurkan kutipan dalam HTML, dan tuntutan kutipan untuk jenis dokumen ketat seperti XHTML.
Kadang-kadang diperlukan untuk menggunakan tanda kutip. Contoh ini tidak akan menampilkan atribut judul dengan benar, karena mengandung spasi:
Contoh
<p title=About W3Schools>
Menggunakan tanda kutip adalah yang paling umum. Menghilangkan tanda kutip dapat menghasilkan kesalahan.
Di W3Schools kita selalu menggunakan tanda kutip nilai atribut.
Di W3Schools kita selalu menggunakan tanda kutip nilai atribut.
Single atau Double Quotes?
tanda kutip ganda di sekitar nilai atribut adalah yang paling umum dalam HTML, namun tanda kutip tunggal juga dapat digunakan.
Dalam beberapa situasi, ketika nilai atribut itu sendiri berisi tanda kutip ganda, maka perlu menggunakan tanda kutip tunggal:
<p title='John "ShotGun" Nelson'>
Atau sebaliknya:
<p title="John 'ShotGun' Nelson">
Bab Ringkasan
- Semua elemen HTML dapat memiliki atribut
- The
titleatribut memberikan tambahan "alat-tip" informasi - The
hrefatribut menyediakan informasi alamat untuk link - The
widthdanheightatribut memberikan informasi ukuran untuk gambar - The
altatribut menyediakan teks untuk pembaca layar - Di W3Schools kita selalu menggunakan huruf kecil nama atribut
- Di W3Schools kami selalu mengutip nilai atribut
Latihan HTML
Atribut HTML
Di bawah ini adalah daftar abjad dari beberapa atribut yang sering digunakan dalam HTML, yang Anda akan belajar lebih banyak tentang dalam tutorial ini:
| Attribute | Description |
|---|---|
| alt | Specifies an alternative text for an image, when the image cannot be displayed |
| disabled | Specifies that an input element should be disabled |
| href | Specifies the URL (web address) for a link |
| id | Specifies a unique id for an element |
| src | Specifies the URL (web address) for an image |
| style | Specifies an inline CSS style for an element |
| title | Specifies extra information about an element (displayed as a tool tip) |
Sebuah daftar lengkap dari semua atribut untuk setiap elemen HTML, terdaftar di kami: Referensi Atribut HTML .
Tidak ada komentar:
Posting Komentar