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 listAgar 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
Belum ada tanggapan untuk "Tutorial HTML-6 (ateonsoft.com/ayomaju.com)"
Post a Comment