Beberapa titik yang menarik tentang penggunaan daftar dalam HTML 5.
Bagaimana Anda mengetahui HTML memiliki tiga jenis daftar:
- <ul>, unordered list
- <ol>, ordered list
- <dl>, definition list
<ul> dan <ol>
atribut jenis compact and type tidak lagi didukung HTML 5 (Anda harus menggunakan CSS sebagai gantinya).
<li>
Jenis atribut, yang menentukan jenis daftar, tidak lagi didukung HTML 5 (Anda harus menggunakan CSS sebagai gantinya).
Nilai atribut yang mendefinisikan nilai dari item pertama dalam daftar, tidak lagi dapat lagi digunakan dan hanya dapat digunakan dengan tag <ol>.
Unordered list untuk navigasi bar
Hal lain yang berhubungan dengan daftar pertanyaan tentang struktur panel navigasi dari sebuah website dengan pengenalan <nav> baru dalam HTML tag 5. Bagaimana Anda tahu, daftar unordered biasanya digunakan untuk melaksanakan panel navigasi dari sebuah website. Struktur khas sebuah bar navigasi adalah <div> tag yang berisi daftar unordered dengan beberapa item:
Berikut adalah kode HTML untuk menerapkan struktur dasar sebuah bar navigasi
<div id=”nav”>Dalam HTML 5, struktur sebuah bar navigasi yang sama digambarkan dalam kode sebelumnya. Satu-satunya yang berubah adalah eksternal “wadah” dari unordered list. Anda harus menggunakan <nav> baru bukan generik <div> tag
<ul>
<li><a href=”…”>link 1</a></li>
<li><a href=”…”>link 2</a></li>
<li><a href=”…”>link 3</a></li>
<li><a href=”…”>link 4</a></li>
<ul>
</div>
<nav>Definisi daftar dan <dialog> tag
<ul>
<li><a href=”…”>link 1</a></li>
<li><a href=”…”>link 2</a></li>
<li><a href=”…”>link 3</a></li>
<li><a href=”…”>link 4</a></li>
<ul>
</nav>
Daftar definisi tidak sering digunakan dalam desain Web mengakhiri banyak orang bahkan mengabaikan keberadaan mereka! Secara umum penggunaannya terutama disarankan saat Anda harus mewakili daftar item dengan deskripsi yang terkait untuk setiap item dari daftar. Berikut adalah kode yang menggambarkan daftar definisi yang umum:
<dl>Berikut adalah output dalam sebuah web browser:
<dt>Google</dt>
<dd>Search engine</dd>
<dt>Facebook</dt>
<dd>Social network</dd>
</dl>
Search engine
Social network
HTML 5 memperkenalkan tag <dialog> baru yang menggunakan <dt> dan <dl> tag (tag ini digunakan untuk mendefinisikan sebuah istilah dan deskripsi dalam sebuah daftar definisi) untuk menggambarkan sebuah percakapan. Berikut adalah contoh struktur dialog
<dialog>Dan di bawah adalah output dalam sebuah web browser:
<dt>Deana</dt>
<dd>What time is it?</dd>
<dt>Ocim</dt>
<dd>Three o’clock</dd>
<dt>Deana</dt>
<dd>Thanks!</dd>
</dialog>
Anna
What time is it?
Mark
Three o’clock
Anna
Thanks!
selamat mencoba html 5 ya!! n.n
tak ada hasil tanpa mencoba….
Tidak ada komentar:
Posting Komentar