Daftar Istilah Penting:
- Internet
- Singkatan dari interconnection network atau hubungan antar jaringan. Internet ialah jaringan komputer global dan merupakan jaringan komputer yang terbesar di dunia karena mampu menghubungkan seluruh komputer yang ada di dunia.
- HTTP
- Singkatan dari Hypertext Transfer Protocol adalah salah satu protokol bahasa yang digunakan untuk berkomunikasi antar server komputer dalam internet. Protokol bahasa yang lain dalam internet misalnya: Telnet, News, Gropher, FTP.
Karena cuma demo, cukup dua definisi sajalah. Untuk membuat daftar definisi semacam di atas digunakan tiga macam tag yaitu <DL> yang menandai dimulai atau diakhirinya daftar definisi, <DT> yang menandai paragraf normal (yang dijelaskan) dan <DD> yang menandai paragraf yang agak masuk ke dalam (yang menjelaskan paragraf di atasnya).
Untuk contoh di atas beginilah kode sumbernya:
| <HTML><BODY> <p align="center"><b>Daftar Istilah Penting:</b> <DL> <DT><B>Internet</b> <DD>Singkatan dari <i>interconnection network</i> atau hubungan antar jaringan. Internet ialah jaringan komputer global dan merupakan jaringan komputer yang terbesar di dunia karena mampu menghubungkan seluruh komputer yang ada di dunia. <DT><b>HTTP</B> <DD>Singkatan dari <i>Hypertext Transfer Protocol</i> adalah salah satu protokol bahasa yang digunakan untuk berkomunikasi antar server komputer dalam internet. Protokol bahasa yang lain dalam internet misalnya: Telnet, News, Gropher, FTP.
</DL> Karena cuma demo, cukup dua definisi sajalah. Nah, paragraf ini kembali normal. </HTML></BODY> |
Sekarang, cobalah berlatih membuat daftar definisi sendiri!
DAFTAR ITEM (BULLET AND NUMBERING)
Ada dua macam daftar item yaitu daftar item tak berurut (bullet) dan daftar item berurut (numbering).
Contoh daftar item tak berurut (bullet):
- item pertama
- item kedua
- item ketiga
Contoh daftar item berurut (numbering):
- item pertama
- item kedua
- item ketiga
Untuk membuat daftar item tak berurut kita gunakan tag <UL> sedang untuk membuat daftar item berurut digunakan tag <OL>. Adapun setiap item ditandai dengan tag <LI>.
Beginilah kode sumber untuk daftar item tak berurut di atas:
| <ul>
<li>item pertama</li>
<li>item kedua</li>
<li>item ketiga</li>
</ul> |
Dan beginilah kode sumber untuk daftar item berurut di atas:
| <ol>
<li>item pertama</li>
<li>item kedua</li>
<li>item ketiga</li>
</ol> |
Kita pun dapat membuat daftar item bertingkat atau daftar item di dalam daftar item. Contohnya sebagai berikut:
- item pertama
- item kedua
- sub item pertama
- sub item kedua
- sub sub item pertama
- sub sub item kedua
- sub sub item ketiga
- sub item ketiga
- item ketiga
|
Untuk membuat daftar item bertingkat seperti di atas tidak ada penambahan tag atau atribut apa-apa. Yang dilakukan hanyalah menempatkan tag-tag daftar item tingkat bawah di dalam daftar item tingkat di atasnya. Untuk jelasnya beginilah source kodenya:
| <ul>
<li>item pertama</li> <li>item kedua</li>
<ul>
<li>sub item pertama</li>
<li>sub item kedua</li>
<ul>
<li>sub sub item pertama</li>
<li>sub sub item kedua</li>
<li>sub sub item ketiga</li>
</ul>
<li>sub item ketiga</li>
</ul>
<li>item ketiga</li>
</ul> |
Penulisan kode-kode HTML di atas sengaja kita beri spasi agak ke dalam, agar lebih mudah dibaca dan dimengerti mana yang level pertama, kedua dan seterusnya. Sebenarnya, tanpa pemberian spasi, hasilnya dalam browser tetap akan menggunakan spasi agak ke dalam untuk level-level di bawahnya.
Cara yang sama dilakukan untuk membuat daftar item berurut bertingkat. Kita tinggal mengganti tag <UL> dengan tag <OL> maka hasilnya akan seperti ini:
- item pertama
- item kedua
- sub item pertama
- sub item kedua
- sub sub item pertama
- sub sub item kedua
- sub sub item ketiga
- sub item ketiga
- item ketiga
|
Dari contoh daftar item tak berurut yang bertingkat di atas, kita lihat bahwa secara default, browser akan menampilkan gambar (bullet) bulatan hitam untuk item-item level pertama, lingkaran untuk untuk item-item level kedua, dan kotak hitam untuk item-item level ketiga. Sebenarnya kita pun bisa memilih sendiri bullet jenis apa yang kita ingin gunakan dengan menambah atribut TYPE dalam tag <UL>. Rumusnya:
<UL TYPE="jenis bullet">. Dimana nama bullet ada tiga macam: "disc" untuk bulatan hitam, "circle" untuk lingkaran, dan "square" untuk kotam hitam. Jadi bila kita ingin membuat daftar item semacam ini:
- item pertama
- item kedua
- item ketiga
|
Maka kita menuliskan kode-kode HTML sebagai berikut:
| <ul type="square">
<li>item pertama</li>
<li>item kedua</li>
<li>item ketiga</li>
</ul> |
Untuk daftar item berurut (numbering), jenis angkanya pun dapat diganti dengan menggunakan atribut yang sama. Jadi rumusnya:
<OL TYPE="jenis angka">. Sedangkan jenis angkanya diisi dengan angka 1, A, a, I, atau i tergantung selera kita. Contoh:
| <ol type="I">
<li>item pertama</li>
<li>item kedua</li>
<ol type="A">
<li>sub item pertama</li>
<li>sub item kedua</li>
<ol type="1">
<li>sub sub item pertama</li>
<li>sub sub item kedua</li>
<li>sub sub item ketiga</li>
</ol>
<li>sub item ketiga</li>
</ol>
<li>item ketiga</li>
</ol> |
Akan menghasilkan daftar item sebagai berikut:
- item pertama
- item kedua
- sub item pertama
- sub item kedua
- sub sub item pertama
- sub sub item kedua
- sub sub item ketiga
- sub item ketiga
- item ketiga
|
Sekian pelajaran tentang bullet dan numbering.
