HTML Cheatsheet

Written By batikbumi on 4 Mei 2012 | 09.38

HTML cheatsheets

Daftar Isi HTML Cheatsheet

1. Tag Dasar
2. Atribut pada body
3. Tag pada teks
4. Link
5. Pem-formatan
6. Tabel
7. Atribut pada tabel
8. Frame
9. Atribut pada Frame
10. Form


1. Tag Dasar
<html></html> Membuat dokumen HTML
<head></head> Berisi informasi penting yang tidak ditampilkan pada website
<body></body> Bagian yang akan ditampilkan pada halaman website
2. Atribut pada body
<body bgcolor="red"> Mengatur warna latar belakang
<body text="black"> Mengatur warna teks
<body link="blue"> Mengatur warna dari link
<body vlink="#ff0000"> Mengatur warna link yang diikuti
<body alink="#00ff00"> Mengatur warna link yang di klik
<body ondragstart="return false" onselectstart="return false"> Membuat seleksi pada teks dengan mouse maupun keyboard tidak bisa digunakan/ tidak aktif
3. Tag pada Teks
<pre></pre> Membuat teks yang ditulis seperti apa adanya
<hl></hl> Membuat judul dengan ukuran teks paling besar
<h6></h6> Membuat judul dengan ukuran teks paling kecil
<b></b> Membuat teks menjadi tebal (bold)
<i></i> Membuat teks miring
<tt></tt> Membuat teks berkesan seperti ditulis dengan menggunakanmesin ketik
<cite></cite> Membuat Kutipan (biasanya menjadi ditulis miring/italic)
<em></em> Membuat penekanan kata (dengan italic atau bold)
<strong></strong> Membuat penekanan kata (dengan italic atau bold)
<font size="3"></font> Mengatur ukuran huruf dari 1 sampai 7
<font color="green"></font> Mengatur warna huruf
4. Link
<a href="URL"></a> Membuat hyperlink
<a href="mailto:EMAIL"></a> Membuat link email
<a href="URL"><img src="URL"> </a> Membuat link pada gambar (image/link)
<a name="NAME"></a> Membuat target link pada halaman yang sama
<a href="#NAME"></a> Membuat link yang mengarah ke target link pada halaman yang sama
5. Pem-formatan
<p></p> Membuat paragrap
<p align="left"> Paragraf rata kiri (default), right (kanan), or center (tengah).
<br> Turun satu baris ke bawah/ pindah baris
<blockquote></blockquote> Membuat paragraph menjorok ke dalam pada 2 sisi
<dl></dl> Membuat daftar definisi
<dt> Pendahuluan tiap definisi
<dd> Pendahuluan tiap definisi
<ol></ol> Membuat list (daftar) dengan urutan angka
<ul></ul>  Membuat list (daftar) tanpa urutan angka
<li></li> masing-masing list dari tag <ul> maupun <ol>
<div align="left"> Tag untuk memformat sebagian besar blok menggunakan stylesheet (css)
<img src="name"> Menampilkan gambar/image
<img src="name" align="left"> Gambar (image):rata kiri (left), right, center; bottom, top, middle
<img src="name" border="1"> Mengatur garis tepi pada gambar/image
<hr /> Menambahkan garis horizontal
<hr size="3" /> Mengatur ketebalan garis horizontal
<hr width="80%" /> Mengatur lebar halaman sebesar 80% dari lebar absolute/ total
<hr noshade /> Membuat aturan tanpa efek bayangan
6. Tabel
<table></table> Mendefinisikan/ membuat tabel
<tr></tr> Baris pada tabel
<td></td> Kolom pada tabel
<th></th> Judul dari tabel (Sel normal dengan efek bold, dan rata tengah/centered)
7. Atribut pada Tabel
<table border="1"> Mengatur tebal garis tepi dari tabel
<table cellspacing="1"> Mengatur besarnya spasi antara sel pada tabel
<table cellpadding="1"> Mengatur besarnya spasi antara garis tepi sel dengan konten sel
<table width="500" or "80%"> Mengatur lebar tabel
<tr align="left"> atau <td align="left"> Mengatur alignment horizontal pada sel (left, center, atau right)
<tr valign="top"> atau <td valign="top">  Mengatur alignment vertikal pada sel  (top, middle, atau bottom)
<td colspan="2"> Mengatur penggabungan kolom (default=1)
<td rowspan="4">  Mengatur penggabungan baris  (default=1)
<td nowrap> Mencegah terjadinya tabel yang berantakan karena tidak sesuai dengan lebar halaman yang tersedia
8. Frame
<frameset></frameset> Mengganti tag <body> dalam dokumen frame
<frameset rows="value,value"> Mendefinisikan baris dalam frameset (dalam pixel atau persen)
<frameset cols="value,value"> Mendefinisikan kolom dalam frameset (dalam pixel atau persen)
<noframes></noframes> Mendefinisikan apa yang akan tampil pada browser yang tidak support pada frame
9. Atribut pada Frame
<frame src="URL"> Menentukan dokumen HTML mana yang akan ditampilkan
<frame name="name"> Memberi nama frame jadi bisa menjadi target bagi frame lain
<frame marginwidth="value"> Mendefinisikan margin kiri dan kanan frame; harus sama dengan atau lebih besar dari 1
<frame marginheight="value"> Mendefinisikan margin atas dan bawah frame; harus sama dengan atau lebih besar dari 1
<frame scrolling="value"> Mengatur apakah frame akan bisa di scroll atau tidak; dengan nilai :( yes, no, dan auto).
<frame noresize="noresize"> Mencegah pengguna untuk mengubah ukuran/ resize dari frame
10. Form
Untuk membuat form berfungsi anda memerlukan pemrograman di sisi server (PHP, ASP dll). Sedang pada HTML hanya akan membuat tampilannya saja di halaman website.
<form></form> Membuat form baru
<select multiple name="NAME" size=?></select> Membuat scrolling menu. Size mengatur jumlah menu yang muncul sebelum di scroll.
<option> Mengatur setiap item pada menu
<select name="NAME"></select> Membuat pulldown menu
<option>  Mengatur setiap item pada menu
<textarea name="NAME" cols=40 rows=8></textarea name> Membuat text box area. Columns mengatur lebarnya; rows mengatur tinggi text box.
<input type="checkbox" name="NAME"> Membuat checkbox. diikuti teks.
<input type="radio" name="NAME" value="x"> Membuat radio button. diikuti teks
<input type="text" name="NAME" size=20> Membuat text area hanya satu baris. Size mengatur panjang teks area (ukuran dalam jumlah karakter).
<input type="submit" value="NAME"> Membuat tombol submit
<button type="submit">Submit</button> Membuat tombol
<input type="image" border=0 name="NAME" src="name.gif"> Membuat tombol submit menggunakan gambar/image
<input type="reset"> Membuat tombol Reset


0 komentar:

Posting Komentar