Lembar Cheat Esensial HTML: Tag, Atribut, dan Lainnya

Membangun halaman web dimulai dengan HTML. Mempercantik mereka dan membuat mereka interaktif datang kemudian. Tetapi untuk mulai membuat situs web statis fungsional, Anda memerlukan pemahaman tentang HTML. (Ingin pengenalan singkat tentang bahasa markup ini? Baca kami FAQ HTML.)

Sebagai bagian dari mempelajari bahasa, ada daftar panjang elemen yang perlu Anda tambahkan ke kosakata HTML Anda. Dan tugas ini mungkin tampak menakutkan pada awalnya, itulah sebabnya kami membuat lembar contekan berikut. Ini memberi Anda cara mudah untuk menemukan/memahami/mengingat elemen HTML kapan pun Anda membutuhkannya.

Lembar contekan mencakup tag dan atribut untuk menyusun halaman web, memformat teks, menambahkan formulir, gambar, daftar, tautan, dan tabel. Ini juga mencakup tag yang diperkenalkan dalam kode HTML5 dan HTML untuk karakter khusus yang umum digunakan.

DOWNLOAD GRATIS: Lembar contekan ini tersedia sebagai PDF yang dapat diunduh dari mitra distribusi kami, TradePub. Anda harus melengkapi formulir singkat untuk mengaksesnya untuk pertama kali saja. Unduh Lembar Cheat Esensi HTML.

Lembar Cheat Esensi HTML

... ... ... ... ...

...

Jalan pintas	Tindakan
Tag Dasar
...	Tag pertama dan terakhir dari dokumen HTML. Semua tag lainnya terletak di antara tag pembuka dan penutup ini.
...	Menentukan koleksi metadata untuk dokumen.
	Menjelaskan judul halaman dan muncul di bilah judul browser.
...	Mencakup semua konten yang akan ditampilkan di halaman web.
Informasi Dokumen
Menyebutkan URL dasar dan semua tautan relatif ke dokumen.
Untuk informasi tambahan tentang halaman seperti penulis, tanggal publikasi, dll.
Tautan ke elemen eksternal seperti lembar gaya.
	Berisi informasi gaya dokumen seperti CSS (Cascading Style Sheets).
	Berisi tautan ke skrip eksternal.
Pemformatan Teks
... ATAU ...	Membuat teks menjadi tebal.
...	Miringkan teks dan membuatnya tebal.
...	Miringkan teks tetapi tidak membuatnya tebal.
...	Teks yang dicoret.
...	Mengutip penulis kutipan.
...	Memberi label pada bagian teks yang dihapus.
...	Menampilkan bagian yang telah disisipkan ke dalam konten.
...	Untuk menampilkan kutipan. Sering digunakan dengan menandai.
...	Untuk kutipan yang lebih pendek.
...	Untuk singkatan dan bentuk lengkap.
...	Menentukan detail kontak.
...	Untuk definisi.
...	Untuk potongan kode.
...	Untuk menulis subskrip
...	Untuk menulis superskrip.
...	Untuk mengurangi ukuran teks dan menandai informasi yang berlebihan dalam HTML5.
Struktur Dokumen
...	Tingkat judul yang berbeda. H1 adalah yang terbesar dan H6 adalah yang terkecil.
...	Untuk membagi konten menjadi blok.
...	Menyertakan elemen sebaris, seperti gambar, ikon, emotikon, tanpa merusak pemformatan halaman.
...	Berisi teks biasa.
	Membuat baris baru.
	Menggambar bilah horizontal untuk menunjukkan akhir bagian.
Daftar
...	Untuk daftar barang yang dipesan.
...	Untuk daftar item yang tidak berurutan.
...	Untuk item individual dalam daftar.
...	Daftar item dengan definisi.
...	Definisi satu istilah sejalan dengan isi tubuh.
...	Deskripsi untuk istilah yang ditentukan.
Tautan
...	Tag jangkar untuk hyperlink.
...	Tag untuk menautkan ke alamat email.
...	Tag jangkar untuk mencantumkan nomor kontak.
...	Anchor tag untuk menautkan ke bagian lain dari halaman yang sama.
...	Menavigasi ke bagian div halaman web. (Variasi dari tag di atas)
Gambar-gambar
	Untuk menampilkan file gambar.
Atribut untuk menandai
src="url"	Tautan ke jalur sumber gambar.
alt="teks"	Teks yang ditampilkan saat mouse diarahkan ke gambar.
tinggi = “”	Tinggi gambar dalam piksel atau persentase.
lebar=""	Lebar gambar dalam piksel atau persentase.
sejajar=””	Penjajaran relatif gambar pada halaman.
perbatasan=””	Ketebalan batas gambar.
	Tautan ke peta yang dapat diklik.
	Nama gambar peta.
Area gambar peta gambar.
Atribut untuk menandai
bentuk=""	Bentuk area gambar.
koordinat =” ”	Koordinat area gambar peta.
Formulir
...	Tag induk untuk formulir HTML.
Atribut untuk menandai
tindakan="url"	URL tempat data formulir dikirimkan.
metode =” ”	Menentukan protokol pengiriman formulir (POST atau GET).
enctype=""	Skema penyandian data untuk pengiriman POST.
pelengkapan otomatis	Menentukan apakah pelengkapan otomatis formulir aktif atau nonaktif.
tidak memvalidasi	Menentukan apakah formulir harus divalidasi sebelum diserahkan.
terima-charsets	Menentukan pengkodean karakter untuk pengiriman formulir.
target	Menunjukkan di mana respons pengiriman formulir akan ditampilkan.
...	Mengelompokkan unsur-unsur terkait dalam bentuk/
...	Menentukan apa yang harus dimasukkan pengguna di setiap bidang formulir.
...	Keterangan untuk elemen fieldset.
Menentukan jenis input apa yang akan diambil dari pengguna.
Atribut untuk menandai
jenis="”	Menentukan jenis input (teks, tanggal, kata sandi).
nama =””	Menentukan nama field input.
nilai =””	Menentukan nilai di bidang input.
ukuran =””	Mengatur jumlah karakter untuk bidang input.
panjang maksimum = “”	Menyetel batas karakter input yang diizinkan.
yg dibutuhkan	Membuat bidang input wajib.
lebar =””	Menetapkan lebar bidang input dalam piksel.
tinggi =””	Mengatur tinggi bidang input dalam piksel.
tempat penampung =””	Menjelaskan nilai bidang yang diharapkan.
pola =””	Menentukan ekspresi reguler, yang dapat digunakan untuk mencari pola dalam teks pengguna.
min=””	Nilai minimum yang diizinkan untuk elemen input.
maks =””	Nilai maksimum yang diizinkan untuk elemen input.
dengan disabilitas	Menonaktifkan elemen input.
...	Untuk menangkap string data yang lebih panjang dari pengguna.
...	Menentukan daftar opsi yang dapat dipilih pengguna.
Atribut untuk menandai
nama =””	Menentukan nama untuk daftar dropdown.
ukuran =””	Jumlah opsi yang diberikan kepada pengguna.
banyak	Menyetel apakah pengguna dapat memilih beberapa opsi dari daftar.
yg dibutuhkan	Menentukan apakah memilih opsi diperlukan untuk pengiriman formulir.
fokus otomatis	Menentukan bahwa daftar drop-down secara otomatis menjadi fokus setelah halaman dimuat.
...	Mendefinisikan item dalam daftar dropdown.
nilai =””	Menampilkan teks untuk setiap opsi yang diberikan.
terpilih	Menetapkan opsi default yang ditampilkan.
...	Tag untuk membuat tombol untuk pengiriman formulir.
Objek dan iFrame
	Menjelaskan tipe file yang disematkan.
Atribut untuk
tinggi =””	Ketinggian benda.
lebar =””	Lebar benda.
jenis="”	Jenis media yang dikandung objek.
	Bingkai sebaris untuk menyematkan informasi eksternal.
nama =””	Nama iFrame.
src="”	URL sumber untuk konten di dalam bingkai.
srcdoc="”	Konten HTML dalam bingkai.
tinggi =””	Tinggi iFrame.
lebar=""	Lebar iFrame.
Menambahkan parameter tambahan untuk menyesuaikan iFrame.
...	Menyematkan aplikasi atau plugin eksternal.
Atribut untuk
tinggi = ""	Mengatur ketinggian embed.
lebar=""	Mengatur lebar embed.
jenis="”	Jenis atau format sematan.
src="”	Jalur sumber file yang disematkan.
Tabel
...	Mendefinisikan semua konten untuk sebuah tabel.
Deskripsi tabel.
Header untuk setiap kolom dalam tabel.
Mendefinisikan data tubuh untuk tabel.
Menjelaskan konten untuk footer tabel.
Konten untuk satu baris.
	...	Data dalam satu item header.
	...	Konten dalam satu sel tabel.
Kelompokkan kolom untuk pemformatan.
Satu kolom informasi.
Tag Baru HTML5
...	Menentukan header halaman web.
	Menentukan footer halaman web.
...	Menandai konten utama halaman web.
...	Menentukan artikel.
	Menentukan konten bilah sisi halaman.
...	Menentukan bagian tertentu di halaman web.
...	Untuk menjelaskan informasi tambahan.
...	Digunakan sebagai heading untuk tag di atas. Selalu terlihat oleh pengguna.
...	Membuat kotak dialog.
...	Digunakan untuk memasukkan grafik dan gambar.
	Menjelaskan elemen.
...	Menyoroti bagian tertentu dari teks.
	Kumpulan tautan navigasi di halaman web.
...	Item tertentu dari daftar atau menu.
...	Mengukur data dalam rentang tertentu.
...	Menempatkan bilah kemajuan dan melacak kemajuan.
...	Menampilkan teks yang tidak mendukung anotasi Ruby.
...	Menampilkan detail karakter tipografi Asia Timur.
...	Anotasi Ruby untuk tipografi Asia Timur.
...	Mengidentifikasi waktu dan tanggal.
Sebuah jeda baris dalam konten.
Objek Karakter HTML5
" ATAU "	Tanda kutip
< ATAU <	Lebih kecil dari tanda (
> ATAU &gt ;	Lebih besar dari tanda (>)
ATAU &nbsp ;	Ruang tanpa putus
© OR &kopi ;	Simbol hak cipta
™ ATAU &ucirc ;	Simbol merek dagang
@ ATAU &Uuml ;	simbol “di” (@)
& ATAU &	Simbol Ampersand (&)
• ATAU &ouml ;	Peluru kecil
Abaikan spasi sebelum titik koma saat mengetik karakter HTML.

Bangun Situs Web untuk Pengalaman Langsung

Setelah kamu mengerti dasar-dasar kode HTML dan memiliki pengetahuan tentang CSS dan JavaScript, coba tangan Anda dalam membangun situs web Cara Membuat Website: Untuk PemulaHari ini saya akan memandu Anda melalui proses pembuatan website lengkap dari awal. Jangan khawatir jika ini terdengar sulit. Saya akan memandu Anda melalui setiap langkah. Baca selengkapnya . Juga, pastikan untuk menyelamatkan kami Lembar contekan properti CSS3 Lembar Cheat Properti CSS3 EsensialKuasai sintaks CSS penting dengan lembar contekan properti CSS3 kami. Baca selengkapnya dan lembar contekan JavaScript Lembar Cheat JavaScript UltimateDapatkan penyegaran cepat pada elemen JavaScript dengan lembar contekan ini. Baca selengkapnya untuk penggunaan di masa depan!