Bullet And Numbering Pada Dokumen HTML
advertisement
Bullet And Numbering Pada Dokumen HTML 4 10 27 Bullet And Numbering Pada Dokumen HTML Tujuan Pembelajaran : Bisa menggunakan tag yang berfungsi untuk membuat Bullet dalam berbagai bentuk dan cara. Bisa menggunakan tag yang berfungsi untuk membuat Numbering dalam berbagai bentuk dan cara. 4.1 Pendahuluan Pada tampilan dokumen HTML terkadang kita menginginkan terlihat lebih unik dan terlihat menarik. Selain itu mungkin kita hanya ingin memperjelas informasi tertentu, dalam hal ini misalnya kita ingin informasi tersebut diletakan pada poin-poin khusus atau list-list khusus. Untuk membuat poin atau list tersebut pada bab ini kita menggunakan dua model, yaitu Bullet dan Numbering. Bullet dan Numbering tersebut merupakan simbol atau karakter khusus yang diletakkan didepan suatu teks tertentu. 4.2 Daftar Item dengan Bullet Pada HTML untuk membuat Bullet atau yang sering dikenal dengan tanda daftar list, kita dapat menggunakan tag <UL>. Dan untuk mengakhiri penggunaan tag <UL> diakhir teks yang diberi tanda bullet diberikan tanda </UL>. cara penulisan pada dokumen HTML dapat dilihat di bawah ini : Bullet.html <html> <head> <title>pemakaian tag ul</title> </head> <body> <h2>Daftar Nama Ikan :</h2> <ul> ©Pengembangan Web/Buku Ajar/T.I/Darmajaya Bullet And Numbering Pada Dokumen HTML 28 Louhan<br> Sepat<br> Betok<br> Nila<br> Lele Dumbo </ul> ******** </body> </html> Pada netscape navigator, jenis bullet dapat ditentukan melalui atribut type pada tag <li>. Kemungkinan nilai untuk type diperlihatkan pada kode-kode dan hasil program berikut : Bullet2.html <html> <head> <title>pemakaian tag ul</title> </head> <body> <h2>Daftar type li :</h2> <ul> <li>hasil li tanpa diberi atribut type</li><br> <li type="circle">Circle<br> <li type="disk">Disk<br> <li type="square">Square<br> </ul> ******** </body> </html> 4.3 Numbering Adakalanya daftar suatu item dikehendaki agar ditampilkan dengan nomor urut. Dengan menggunakan tag <OL>, pemberian nomor dapat diotomatiskan tanpa anda harus menuliskannya. Untuk lebih jelasnya kerjakan latihan berikut : ©Pengembangan Web/Buku Ajar/T.I/Darmajaya Bullet And Numbering Pada Dokumen HTML 29 Numbering.html <html> <head> <title>pemakaian tag ol</title> </head> <body> <b>Cara Memasak Mie Instant</b> <ol> <li>Masak air di panci sampai mendidih<br> <li>Buka pembukus mie instant<br> <li>Masukan Mie + bumbu kedalam Panci<br> <li>Tunggu +- 3 menit<br> <li>Mie siap dihidangkan </ol> </body> </html> 4.4 Daftar Definisi HTML menyediakan jenis daftar khusus yang disebut daftar definisi (definition list). Daftar ini menyediakan tampilan dengan format mirip kamus, dengan definisi suatu istilah diletakan agak menjorok ke kanan. Tiga buah pasangan tag yang terkait dengan daftar definisi dapat dilihat pada tabel berikut : Tag Catatan <DD>…<DD> Digunakan untuk menyatakan wadah bagi definisi istilah <DT>…</DT> Digunakan untuk menyatakan wadah bagi istilah yang akan didefinisikan <DL>…</DL> Digunakan untuk menyatakan wadah bagi daftar Tabel 5. Daftar Tag Definition List ©Pengembangan Web/Buku Ajar/T.I/Darmajaya Bullet And Numbering Pada Dokumen HTML Sebagai contoh perhatikan kode berikut : Definisi.html <html> <head> <title>definisi</title> </head> <body> <b>Kamus Teknologi Informasi</b> <dl> <dt>HTML</dt> <dd>Bahasa yang digunakan untuk menyusun web</dd> <dt>HTTP</dt> <dd>Protokol yang dipakai untuk mentransfer HTML</dd> </dl> </body> </html> ©Pengembangan Web/Buku Ajar/T.I/Darmajaya 30 Bullet And Numbering Pada Dokumen HTML 31 Latihan Soal : Dengan menggunakan kode-kode HTML, buat tampilan dokumen HTML seperti gambar berikut ini : Dengan menggunakan kode-kode HTML, buat tampilan dokumen HTML seperti gambar berikut ini : Selamat Mengerjakan … ! ©Pengembangan Web/Buku Ajar/T.I/Darmajaya
