Nama Atribut HTML Beserta Tag / Element Pasangannya | Belajar HTML dan CSS Dasar - Part 4

Belajar HTML dan CSS Dasar - Part 4.

Nama Atribut HTML Beserta Tag / Element Pasangannya.

Sobat Bermanfaat, Atribut HTML adalah kode tambahan yang berfungsi untuk memberi informasi tambahan mengenai Tag dan atau Element HTML, bisa untuk menjelaskan jenis dan ukuran font, warna, Link Target, dll;untuk lebih lengkapnya silahkan buka kembali Pengertian Tag, Elemen dan Atribut HTML.

Sebagai lanjutan pada kesempatan kali ini, agar lebih mudah untuk menerapkan setiap Atribut HTML berikut ini penulis sertakan Nama Atribut HTML Beserta Tag / Element Pasangannya. dalam bentuk tabel supaya mudah untuk memahaminya.

Atribut	Tag / Element Pasangan	Keterangan
accept	<input>	Menentukan jenis file yang diterima server (hanya untuk type = "file").
accept-charset	<form>	Menentukan pengkodean karakter yang akan digunakan untuk pengiriman formulir.
accesskey	Global Attributes	Menentukan tombol pintas untuk mengaktifkan / elemen fokus.
action	<form>	Menentukan di mana untuk mengirim form-data ketika formulir dikirimkan.
Align	Tidak support pada HTML 5. 0	Menentukan keselarasan sesuai dengan elemen sekitarnya. Gunakan CSS sebagai gantinya.
alt	<area> , <img> , <input>	Menentukan teks alternatif ketika unsur asli gagal untuk menampilkan.
async	<script>	Menentukan bahwa script ini dijalankan asynchronously (hanya untuk skrip eksternal).
autocomplete	<form> , <input>	Menentukan apakah elemen <form> atau <input> harus mengaktifkan autocomplete.
autofocus	<button> , <input> , <keygen> , <select> , <textarea>	Menentukan bahwa elemen harus secara otomatis mendapatkan fokus ketika halaman dimuat.
autoplay	<audio> , <video>	Menentukan bahwa audio / video akan mulai bermain segera setelah siap.
Bgcolor	Tidak support pada HTML 5. 0	Menentukan warna latar belakang dari elemen. Gunakan CSS sebagai gantinya.
Border	Tidak support pada HTML 5. 0	Menentukan lebar perbatasan elemen. Gunakan CSS sebagai gantinya.
challenge	<keygen>	Menetapkan bahwa nilai dari elemen <keygen> harus ditantang ketika disampaikan.
charset	<meta> , <script>	Menentukan karakter pengkodean.
checked	<input>	Menentukan bahwa elemen <input> harus pre-selected ketika memuat halaman (untuk type = "checkbox" atau type = "radio").
cite	<blockquote> , <del> , <ins> , <q>	Menentukan URL yang menjelaskan ” kutipan / dihapus / teks masukan.”
class	Atribut Global	Menentukan satu atau lebih nama kelas untuk elemen (mengacu pada kelas dalam style sheet).
Color	Tidak support pada HTML 5. 0	Menentukan warna teks dari suatu elemen. Gunakan CSS sebagai gantinya.
cols	<textarea>	Menentukan lebar yang terlihat dari textarea.
colspan	<td> , <th>	Menentukan jumlah kolom sel tabel yang harus merentang.
content	<meta>	Memberikan nilai yang terkait dengan http-equiv atau atribut nama.
contenteditable	Atribut Global	Menentukan apakah isi dari sebuah elemen dapat diedit atau tidak.
contextmenu	Atribut Global	Menentukan menu konteks untuk unsur. Menu konteks muncul ketika pengguna klik-kanan pada elemen.
controls	<audio> , <video>	Menentukan bahwa kontrol audio / video harus ditampilkan (seperti tombol play / pause dll).
coords	<area>	Menentukan koordinat daerah.
data	<object>	Menentukan URL dari sumber daya yang akan digunakan oleh objek.
data-*	Atribut Global	Digunakan untuk menyimpan data kustom pribadi ke halaman atau aplikasi.
datetime	<del> , <ins> , <time>	Menentukan tanggal dan waktu.
default	<track>	Menentukan bahwa lagu tersebut akan diaktifkan jika preferensi pengguna tidak menunjukkan bahwa lagu lain akan lebih tepat.
defer	<script>	Menentukan bahwa script ini dijalankan saat halaman selesai parsing (hanya untuk skrip eksternal).
dir	Atribut Global	Menentukan arah teks untuk konten dalam elemen.
dirname	<input> , <textarea>	Menentukan bahwa arah teks akan disampaikan.
disabled	<button> , <fieldset> , <input> , <keygen> , <optgroup>, <option> , <select> , <textarea>	Menentukan bahwa yang ditentukan elemen / sekelompok elemen dinonaktifkan.
download	<a> , <area>	Menentukan bahwa target akan di-download ketika pengguna mengklik hyperlink.
draggable	Atribut Global	Menentukan apakah suatu elemen dapat diseret atau tidak.
dropzone	Atribut Global	Menentukan apakah data yang diseret itu disalin, dipindahkan, atau terkait saat diturunkan.
enctype	<form>	Menentukan bagaimana bentuk-data harus dikodekan ketika mengirimkannya ke server (hanya untuk metode = "post").
for	<label>, <output>	Menentukan bentuk elemen-elemen label / perhitungan terikat.
form	<button> , <fieldset> , <input> , <keygen> , <label>, <meter> , <object> , <output> , <select> , <textarea>	Atribut form menentukan satu atau lebih elemen form adalah milik….
formaction	<button> , <input>	Menentukan di mana untuk mengirim form-data ketika formulir dikirimkan. Hanya untuk type = "submit".
headers	<td> , <th>	Menentukan satu atau lebih header sel sedang sel berhubungan dengan…
height	<canvas>, <embed> , <iframe> , <img> , <input> , <object> , <video>	Menentukan tinggi dari elemen.
hidden	Atribut Global	Menentukan bahwa unsur belum, atau tidak lagi, relevan (tersembunyi).
high	<meter>	Menentukan rentang yang dianggap menjadi nilai tinggi.
href	<a> , <area> , <base> , <link>	Menentukan URL dari halaman link menuju ke…
hreflang	<a> , <area> , <link>	Menentukan bahasa dokumen terkait.
http-equiv	<meta>	Memberikan header HTTP untuk informasi / nilai atribut konten.
id	Atribut Global	Menentukan sebuah id unik untuk elemen.
ismap	<img>	Menentukan gambar sebagai server-side gambar-peta.
keytype	<keygen>	Menentukan algoritma keamanan kunci.
kind	<track>	Menentukan jenis teks track.
label	<track>	Menentukan judul lagu track.
lang	Atribut Global	Menentukan bahasa konten elemen.
list	<input>	Mengacu pada elemen <datalist> yang berisi opsi yang telah ditetapkan untuk elemen <input>.
loop	<audio> , <video>	Menentukan bahwa audio / video akan mulai dari awal lagi, setiap kali selesai.
low	<meter>	Menentukan rentang yang dianggap nilai yang rendah.
manifest	<html>	Menentukan alamat manifest cache dokumen (untuk browsing offline).
max	<input> , <meter> , <progress>	Menentukan nilai maksimum.
maxlength	<input> , <textarea>	Menentukan jumlah karakter maksimum yang diizinkan dalam suatu elemen.
media	<a> , <area> , <link> , <source> , <style>	Menentukan apa yang media / perangkat dokumen terkait dioptimalkan untuk….
method	<form>	Menentukan metode HTTP untuk digunakan saat mengirim form-data.
min	<input> , <meter>	Menentukan nilai minimum.
multiple	<input> , <select>	Menentukan bahwa pengguna dapat memasukkan lebih dari satu nilai.
muted	<video>	Menentukan bahwa output audio video untuk diredam.
name	<button> , <fieldset> , <form> , <iframe> , <input> , <keygen> , <map> , <meta> , <object> , <output> , <param> , <select> , <textarea>	Menentukan nama elemen.
novalidate	<form>	Menentukan bahwa form tidak harus divalidasi ketika disampaikan.
onabort	<audio> , <embed> , <img> , <object> , <video>	Script yang akan dijalankan dibatalkan.
onafterprint	<body>	Script akan dijalankan setelah dokumen dicetak.
onbeforeprint	<body>	Script akan dijalankan sebelum dokumen dicetak
onbeforeunload	<body>	Script akan dijalankan ketika dokumen akan segera diturunkan (unload).
onblur	Semua Element	Script akan dijalankan ketika elemen kehilangan fokus.
oncanplay	<audio> , <embed> , <object> , <video>	Script akan dijalankan ketika file siap untuk mulai bermain (ketika telah penyangga (buffering) cukup untuk memulai).
oncanplaythrough	<audio> , <video>	Script akan dijalankan ketika file dapat memainkan semua sampai akhir tanpa berhenti untuk buffering.
onchange	Semua Element.	Script akan dijalankan ketika nilai elemen berubah.
onclick	Semua Element.	Script akan dijalankan ketika elemen tersebut diklik.
oncontextmenu	Semua Element.	Script akan dijalankan ketika menu konteks dipicu.
oncopy	Semua Element.	Script akan dijalankan bila konten dari elemen disalin.
oncuechange	<track>	Script akan dijalankan ketika ada perubahan isyarat dalam elemen <track>.
oncut	Semua Element.	Script akan dijalankan bila konten dari elemen dipotong.
ondblclick	Semua Element.	Script akan dijalankan ketika elemen diklik ganda.
ondrag	Semua Element.	Script akan dijalankan pada akhir tindakan (seret).
ondragend	Semua Element.	Script akan dijalankan pada akhir tindakan (seret).
ondragenter	Semua Element.	Script akan dijalankan ketika elemen yang terbawa ke target penurunan yang valid.
ondragleave	Semua Element.	Script akan dijalankan ketika elemen meninggalkan target penurunan yang valid
ondragover	Semua Element.	Script akan dijalankan ketika elemen diseret pada target penurunan yang valid.
ondragstart	Semua Element.	Script untuk dijalankan pada awal tindakan seret.
ondrop	Semua Element.	Script akan dijalankan ketika elemen seret sedang diturunkan.
ondurationchange	<audio> , <video>	Script akan dijalankan ketika panjang Media ada perubahan.
onemptied	<audio> , <video>	Script akan dijalankan ketika sesuatu yang buruk terjadi dan file yang tiba-tiba tidak tersedia (seperti tiba-tiba terputus).
onended	<audio> , <video>	Script akan dijalankan ketika media mencapai akhir (acara berguna untuk pesan-pesan seperti "terima kasih telah mendengarkan")
onerror	<audio> , <body> , <embed> , <img> , <object> , <script> , <style> , <video>	Script akan dijalankan bila terjadi kesalahan.
onfocus	Semua Element.	Script akan dijalankan ketika elemen mendapat fokus.
onhashchange	<body>	Script akan dijalankan ketika ada perubahan pada bagian anchor dari URL.
oninput	Semua Element.	Script akan dijalankan ketika elemen mendapat masukan dari pengguna.
oninvalid	Semua Element.	Script akan dijalankan ketika elemen tidak valid.
onkeydown	Semua Element.	Script akan dijalankan ketika pengguna menekan tombol.
onkeypress	Semua Element.	Script akan dijalankan ketika pengguna menekan tombol.
onkeyup	Semua Element.	Script akan dijalankan ketika pengguna membuka kunci.
onload	<body> , <iframe> , <img> , <input> , <link> , <script> , <style>	Script akan dijalankan ketika elemen selesai loading.
onloadeddata	<audio> , <video>	Script akan dijalankan ketika media data selesai loading.
onloadedmetadata	<audio> , <video>	Script akan dijalankan ketika metadata (seperti dimensi dan durasi) dimuat.
onloadstart	<audio> , <video>	Script untuk dijalankan ketika file mulai dimuat sebelum ada sesuatu yang lain benar-benar dimuat.
onmousedown	Semua Element.	Script akan dijalankan ketika tombol mouse ditekan pada sebuah elemen.
onmousemove	Semua Element.	Script untuk dijalankan selama pointer mouse bergerak di atas elemen.
onmouseout	Semua Element.	Script akan dijalankan ketika pointer mouse bergerak keluar dari elemen.
onmouseover	Semua Element.	Script akan dijalankan ketika mouse pointer bergerak keluar elemen.
onmouseup	Semua Element.	Script akan dijalankan ketika tombol mouse dilepaskan keluar elemen.
onmousewheel	Semua Element.	Script akan dijalankan ketika roda mouse (mouse wheel) sedang menggulir keluar elemen.
onoffline	<body>	Script akan dijalankan ketika browser mulai bekerja secara offline.
ononline	<body>	Script akan dijalankan ketika browser mulai bekerja secara online.
onpagehide	<body>	Script akan dijalankan ketika pengguna menavigasi menjauh dari halaman.
onpageshow	<body>	Script akan dijalankan ketika pengguna menavigasi ke halaman.
onpaste	Semua Element.	Script akan dijalankan ketika pengguna mem-paste beberapa konten dalam elemen.
onpause	<audio> , <video>	Script akan dijalankan ketika media dihentikan sementara oleh pengguna atau program.
onplay	<audio> , <video>	Script akan dijalankan ketika media siap untuk dimainkan.
onplaying	<audio> , <video>	Script akan dijalankan ketika media telah mulai dimainkan.
Onpopstate	<body>	Script akan dijalankan ketika ada perubahan pada jendela history.
onprogress	<audio> , <video>	Script akan dijalankan ketika browser sedang dalam proses mendapatkan media Data.
onratechange	<audio> , <video>	Script untuk dijalankan setiap kali ada perubahan pada tingkat pemutaran (seperti ketika pengguna beralih ke gerakan lambat atau modus maju cepat).
onreset	<form>	Script akan dijalankan ketika tombol reset diklik.
onresize	<body>	Script akan dijalankan ketika jendela browser sedang dirubah ukurannya.
onscroll	Semua Element.	Script akan dijalankan ketika elemen scrollbar sedang menggulir.
onsearch	<input>	Script akan dijalankan ketika pengguna menulis sesuatu di kolom pencarian (untuk <input = "search">).
onseeked	<audio> , <video>	Script akan dijalankan ketika atribut pencari diatur ke false menunjukkan bahwa pencarian telah berakhir.
onseeking	<audio> , <video>	Script akan dijalankan ketika atribut pencari diatur pada indikasi yang benar maka pencarian akan aktif.
onselect	Semua Element.	Script akan dijalankan ketika elemen dipilih.
onshow	<menu>	Script akan dijalankan ketika elemen <menu> ditampilkan sebagai menu konteks.
onstalled	<audio> , <video>	Script akan dijalankan bila browser tidak dapat mengambil data media untuk alasan apa pun.
Onstorage	<body>	Script akan dijalankan ketika area Web Storage diperbarui.
onsubmit	<form>	Script akan dijalankan ketika formulir dikirimkan.
onsuspend	<audio> , <video>	Script akan dijalankan saat pengambilan data media dihentikan sebelum benar-benar dimuat untuk alasan apapun.
ontimeupdate	<audio> , <video>	Script akan dijalankan ketika posisi playing dirubah (seperti ketika pengguna meng-play dengan cepat ke titik yang berbeda pada media).
ontoggle	<details>	Script akan dijalankan ketika pengguna membuka atau menutup elemen <details>.
onunload	<body>	Script akan dijalankan saat halaman telah dimuat (atau jendela browser telah ditutup)
onvolumechange	<audio> , <video>	Script untuk dijalankan setiap kali volume berubah (termasuk pengaturan volume untuk "mute").
onwaiting	<audio> , <video>	Script akan dijalankan ketika media telah berhenti namun ada perkiraan untuk melanjutkan (seperti ketika media berhenti untuk buffer (loading) lebih banyak data).
onwheel	Semua Element.	Script akan dijalankan ketika gulungan roda mouse ke atas atau ke bawah elemen.
open	<details>	Menentukan bahwa rincian harus terlihat (open) untuk pengguna.
optimum	<meter>	Menentukan nilai bahwa itu nilai optimal untuk mengukur.
pattern	<input>	Menentukan ekspresi reguler yang diperiksa terhadap sebuah nilai elemen <input>.
placeholder	<input> , <textarea>	Menentukan petunjuk singkat yang menggambarkan nilai yang diharapkan dari elemen.
poster	<video>	Menentukan gambar yang akan ditampilkan saat video sedang didownload, atau sampai pengguna menekan tombol putar.
preload	<audio> , <video>	Menentukan apakah dan bagaimana author berpikir audio / video harus dimuat ketika loading halaman.
readonly	<input> , <textarea>	Menentukan bahwa elemen ini “read-only”
rel	<a> , <area> , <link>	Menentukan hubungan antara dokumen saat ini dan dokumen terkait.
required	<input> , <select> , <textarea>	Menentukan bahwa elemen harus diisi sebelum mengirimkan formulir.
reversed	<ol>	Menentukan bahwa urutan daftar harus turun (9,8,7 ...).
rows	<textarea>	Menentukan jumlah terlihat dari baris dalam textarea.
rowspan	<td> , <th>	Menentukan jumlah baris sel tabel pada area merentang.
sandbox	<iframe>	Memungkinkan set ekstra pembatasan untuk konten dalam <iframe>
scope	<th>	Menentukan apakah sebuah sel header adalah header untuk kolom, baris, atau kelompok kolom atau baris.
scoped	<style>	Menentukan bahwa gaya hanya berlaku untuk elemen induk, elemen dan elemen anakkannya elemen (child elements).
selected	<option>	Menetapkan bahwa pilihan harus pre-selected ketika loading halaman.
shape	<area>	Menentukan bentuk pada <area>.
size	<input> , <select>	Menentukan lebar, dalam karakter (untuk <input>) atau menentukan jumlah pilihan yang terlihat (untuk <select>)
sizes	<link>	Menentukan ukuran sumber daya terkait.
span	<col> , <colgroup>	Menentukan jumlah kolom span.
spellcheck	Atribut Global.	Menentukan apakah elemen adalah memiliki ejaan dan tata bahasa yang diperiksa atau tidak.
src	<audio> , <embed> , <iframe> , <img> , <input> , <script> , <source> , <track> , <video>	Menentukan URL dari file media.
srcdoc	<iframe>	Menentukan konten HTML halaman untuk ditunjukkan di <iframe>.
srclang	<track>	Menentukan bahasa data track teks (diperlukan jika jenis = "teks").
start	<ol>	Menentukan nilai awal dari sebuah daftar ordered (<ol>).
step	<input>	Menentukan interval jumlah yang telah ditetapkan untuk field input.
style	Atribut Global.	Menentukan CSS gaya inline untuk suatu elemen.
tabindex	Atribut Global.	Menentukan urutan tab dari elemen.
target	<a> , <area> , <base> , <form>	Menentukan target untuk tempat membuka dokumen terkait atau di untuk mengirimkan formulir.
title	Atribut Global.	Menentukan informasi tambahan (judul) tentang elemen.
translate	Atribut Global.	Menentukan apakah isi dari sebuah elemen harus diterjemahkan atau tidak.
type	<button> , <embed> , <input> , <link> , <menu> , <object> , <script> , <source> , <style>	Menentukan jenis elemen.
usemap	<img> , <object>	Menentukan gambar sebagai client-side peta.
value	<button> , <input> , <li> , <option> , <progress> , <param>	Menentukan nilai dari elemen.
width	<canvas>, <embed> , <iframe> , <img> , <input> , <object> , <video>	Menentukan lebar elemen.
wrap	<textarea>	Menentukan bagaimana teks dalam area teks harus dibungkus ketika disampaikan dalam formulir.

Contoh penerapan Atribut dan Tag HTML yang sering kita jumpai adalah Hyperlink untuk menghubungkan dengan Dokumen lain, maka penulisannya: <a href="URL-Target">Judul Target</a>
Keterangannya: "<a" = Tag / Element HTML, "href" = Atributnya, "URL-Target" = Nilai / Value dari Atribut, "Judul Target" = Eksekutor (yang terlihat oleh Browser) dan "</a>" = Tag Penutup.

Baca juga: