HTML Tag dan Format

<HTML>
<HEAD>
<TITLE>Latihan Pertama</TITLE>
</HEAD>
<BODY>
Selamat Belajar HTML
</BODY>
</HTML>
Tag <BR>
Fungsi tag <BR> adalah untuk membuat baris baru atau berpindah baris
Tag <P>
Tag <P> digunakan untuk membuat paragraf.
Tag <CENTER>
Untuk menengahkan suatu teks, bisa juga digunakan tag <CENTER>. Tentu saja, untuk mengakhiri
penengahan teks (yakni agar teks berikutnya tidak ditengahkan), perlu disertakan </CENTER>.
Tag <HR>
Untuk mempercantik halaman, seringkali pembuat dokumen Web menambahkan garis horisontal. Garis
ini sebenarnya dapat dibuat dengan mudah, yakni dengan menyertakan tag <HR>.
Daftar atribut tag <HR> Atribut Keterangan
SIZE Menentukan ketebalan
garis
WIDTH Menentukan lebar garis
ALIGN Menentukan peletakkan
teks dalam baris
NOSHADE Mengatur agar garis tidak
disertai bayangan
Contoh penggunaan atribut SIZE :
<HTML>
<HEAD>
<TITLE>Atribut SIZE pada Tag HR</TITLE>
</HEAD>

<BODY>
<H1>KEBUN PESONA</H1>
<HR SIZE = "10">
Jl. Solo Km 14<BR>
Yogyakarta<BR>
Indonesia<BR>
</BODY>
</HTML>

Contoh penggunaan atribut NOSHADE :
<HTML>
<HEAD>
<TITLE>Atribut NOSHADE pada Tag HR</TITLE>
</HEAD>
<BODY>
<H1>KEBUN PESONA</H1>
<HR SIZE = "10" NOSHADE>
Jl. Solo Km 14<BR>
Yogyakarta<BR>
Indonesia<BR>
</BODY>
</HTML>
Contoh penggunaan atribut WIDTH :
<HTML>
<HEAD>
<TITLE>Atribut WIDTH dan ALIGN pada Tag HR</TITLE>
</HEAD>
<BODY>
<HR ALIGN = "CENTER" WIDTH = "5%" SIZE = "10" NOSHADE>
</BODY>
</HTML>
Tag Judul
HTML menyediakan 6 buah tag yang digunakan untuk mengatur ukuran teks yang dijadikan sebagai judul
dalam badan dokumen. Tag-tag judul ini berupa :
􀂃<H1> ... </H1>
􀂃<H2> ... </H2>
􀂃<H3> ... </H3>
􀂃<H4> ... </H4>
􀂃<H5> ... </H5>
􀂃<H6> ... </H6>
MENGGUNAKAN TABEL
Tag-tag yang terkait dengan pembuatan table : Tag Keterangan
<TABLE>…</TABLE> Mengawali dan mengakhiri sebuah table

<CAPTION>…</CAPTION> Menentukan judul pada table
<TR>…</TR> Membuat sebuah baris dalam table
<TH>…</TH> Membuat judul kolom
<TD>…</TD> Membuat sebuah sel data
Menggabungkan Sel
Untuk menggabungkan beberapa baris sel, digunakan atribut ROWSPAN pada tag <TD>.
Untuk menggabungkan beberapa sel dalam satu baris, digunakan atribut COLSPAN pada tag <TH> atau <TD>.
Mengatur Peletakkan Tabel dalam Halaman
Atribut ALIGN pada <TR>, <TH>, dan
<TD> ALIGN dan Nilainya
Keterangan
ALIGN = “LEFT” Teks diatur rata kiri
ALIGN = “CENTER” Teks ditengahkan
ALIGN = “RIGHT” Teks diatur rata
kanan
Mengatur Tinggi Sel
Untuk mengatur tinggi table, digunakan atribut HEIGHT pada tag <TABLE>.
Contoh berikut menunjukkan pengaturan tinggi pada sel tertentu saja. Caranya adalah dengan menggunakan
atribut HEIGHT pada tag <TR>.
Mengatur Lebar Tabel dan Sel
Atribut WIDTH pada tag <TABLE> dapat digunakan untuk mengatur lebar table tanpa tergantung oleh
ukuran jendela browser.
Mengatur Jarak dalam Tabel
Pada tag <TABLE> terdapat dua buah atribut lagi yang dapat digunakan untuk mengatur jarak teks
terhadap tepi kiri (yaitu CELLPADDING) dan untuk mengatur jarak bagian sel terhadap tepi dalam bingkai
table (yaitu CELLSPACING).
Menampilkan Gambar
Untuk menampilkan gambar, digunakan tag <IMG>. Bentuk paling sederhana dari tag <IMG> :
<IMG SRC = ”nama_gambar”>
Contoh :
<IMG SRC = ”keladi.jpg”>
Mengatur Letak Teks Terhadap Gambar

Tag <IMG> menyediakan atribut bernama ALIGN yang
berfungsi untuk mengatur penempatan teks terhadap
gambar dan untuk mengatur penempatan gambar.
Nilai untuk atribut ALIGN : Nilai
Keterangan
TOP Teks diletakkan di bagian atas
MIDDLE Teks diletakkan di tengah-tengah
BOTTOM Merupakan nilai default. Teks
diletakkan di bagian bawah.
LEFT Gambar diletakkan di sebelah kiri
pada halaman
RIGHT Gambar diletakkan di sebelah
kanan pada halaman
Mengatur Ukuran Gambar
Bila Anda memiliki gambar yang berukuran besar dan bermaksud mengubah ukuran gambar saat
gambar ditampilkan, Anda bisa mengaturnya melalui atribut pada tag <IMG> yang bernama HEIGHT dan
WIDTH.
• HEIGHT untuk mengatur tinggi gambar
• WIDTH untuk mengatur lebar gambar
Contoh :
<IMG SRC = ”RedFlash.gif” HEIGHT = “150” WIDTH = ”150”>

HTML Tag dan Format

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Viewers also liked

Viewers also liked (17)

Similar to HTML Tag dan Format

Similar to HTML Tag dan Format (20)

HTML Tag dan Format