Tutorial HTML-6 (ateonsoft.com/ayomaju.com)

Masih membahas komponen Basic HTML Element, kali ini kita akan membahas pemakaian kode untuk definition list dan horizontal Rules (HR). Definition list adalah kode untuk membuat daftar kata dan daftar definisinya, sory kalo salah pengertiannya karena hasil kesimpulan saya sendiri.

Tapi yang jelas dengan menggunakan kode ini, maka hasil pekerjaan kita akan lebih rapi. Setelah sebelumnya telah mengerti cara membuat unordered list di Tutorial HTML lengkap 5, maka artikel ini akan melengkapi pemakaian kode yang berkaitan dengan menampilkan data daftar/list.

Definition list

Agar tidak bertele-tele segera copy kode dibawah ini dan simpan sebagai dokumen HTML.
<html>
<head>
<title>Definition List</title>
</head>
<body>
<p><b>List of Internet Resource</b></p>
<dl>
<dt>HTML
<dd>HyperText Markup Langguage is not Language
Programming</dd>
</dt>
<dt>HTTP
<dd>HyperText Transfer Protocol is TCP/IP
Protocol</dd>
</dt>
<dt>Internet<dd>A network of network</dd>
</dt>
<dt>TCP/IP
<dd>Internet protocol</dd>
</dt>
</dl>
</body>

</html>
Hasilnya akan seperti dibawah ini:

List of Internet Resource

HTML

HyperText Markup Langguage is not Language
Programming

HTTP

HyperText Transfer Protocol is TCP/IP
Protocol

Internet

A network of network

TCP/IP

Internet protocol

Sudah mengerti kan bagaimana dan apa yang dimaksud dengan kode definition list? Jadi secara teori (penjelasan kode) Definition List diapit oleh tag <DL> … </DL> dan <DT> tag

menentukan definition term serta <DD> tag menentukan definition itu
sendiri.

Horizontal Rules(HR)

Horizontal Rule tag digunakan untuk menggambar garis horizontal dalam document HTML. Contoh garisnya seperti dibawah ini:

Standar (kodenya:"<hr />")

---

Tipis (kodenya:"<hr size="1" />")

---

Lebih tebal (kodenya:"<hr size="3" />")

---

Tebal (kodenya:"<hr size="4" />")

---

Untuk lebih jelas perhatikan tabel dibawah ini:

Atribut	Description
Align	menetukan posisi dari HR, dengan value : center | right | left
Width	Untuk menentukan panjang HR default 100%
Size	Untuk menentukan tebal dari HR dalam pixel
Noshad	Efek bayangan

Variasi penggunaan kode seperti dibawah ini:

Kode: <hr align="left" width="300" size="1" />

---

Kode:
<hr align="right" width="300" size="5" noshade="noshade" />

---

Silahkan berkreasi sesuai kebutuhan. Selamat mencoba, dan sampai ketemu di Tutorial HTML lengkap 7. Happy bloging.

feed dari situs: http://www.ateonsoft.com

Tweet

Jangan sampai ketinggalan postingan-postingan terbaik dari Personal Blog. Berlangganan melalui email sekarang juga:

Atau sobat juga bisa follow Personal Blog dengan mengklik tombol di bawah ini:

Artikel keren lainnya:

Ditulis oleh Unknown pada tanggal Senin, 14 Juni 2010