Kali ini membuat list HTML, pengertian dan jenis-jenis List sudah dijelaskan pada postingan sebelumnya,,nah sekarang kita buat skrip sederhana yang menggunakan List,,okeehh,,mulaii?? (hehehe),,check it out..Langkah pertama yang harus dilakukan yaitu membuka notepad (lagi dan lagi notepad,,hehe),,,trus ketikkan skrip dibawah ini :
<html>
<head>
<title>Membuat List</title>
</head>
<body>
<p>Menggunakan List pada HTML <br>
Pertama yaitu menggunakan Ordered List : <br>
Nama-Nama Buah :<br>
<ol type="A">
<li>Mangga</li>
<li>Jeruk</li>
<li>Apel</li>
<li>Durian</li>
</ol>
<br>
Nama-Nama Hewan yaitu :<br>
<ul type="circle">
<li>Kambing</li>
<li>Ayam</li>
<li>Bebek</li>
<li>Gajah</li>
</ul>
<br>
Nah yang ini menggunakan defenition List <br>
<dl>
<dt>ini menggunakan defenition List,,menggunakan defenition term</dt>
<dd>ini menggunakan defenition list,,menggunakan defenition deskription</dd>
</dl>
<p>okeh-okeh ini contoh penggunaan List pada HTML</p></p>
setelah disimpan dengan menggunakan nama latihan2.html,,akan menampilkan hasil sebagai berikut :
Oh iya tambahan,,kita juga bisa membuat nested list atau list bersarang,,dimana suatu list mempunyai list,,,contohnya dapat dilihat pada dibawah ini, kita tinggal mengedit kode yang tadi, dengan cara klik kanan pada file Html-nya lalu pilih open with cari menggunakan notepad, edit menjadi kode seperti dibawah ini :
<html>
<head>
<title>Membuat List</title>
</head>
<body>
<p>Menggunakan List pada HTML <br>
Pertama yaitu menggunakan Ordered List : <br>
Nama-Nama Buah :<br>
<ol type="A">
<li>Mangga</li>
<li>Jeruk</li>
<li>Apel</li>
<li>Durian</li>
</ol>
<br>
Nama-Nama Hewan yaitu :<br>
<ul type="circle">
<li>Kambing</li>
<ol><li>Jantan</oi>
<li>betina</li></ol>
<li>Ayam</li>
<li>Bebek</li>
<li>Gajah</li>
</ul>
<br>
Nah yang ini menggunakan defenition List <br>
<dl>
<dt>ini menggunakan defenition List,,menggunakan defenition term</dt>
<dd>ini menggunakan defenition list,,menggunakan defenition deskription</dd>
</dl>
<p>okeh-okeh ini contoh penggunaan List pada HTML</p></p>
kita save as,dengan nama latihan3.html lalu,hasilnya akan seperti dibawah ini : hasil yang tampil tak akan jauh beda dari skrip sebelumnya hanya bagian dibawah ini saja yang berubah.. :
Okeh,,mudah.kann...so let's try it!!! ^__________^
0 komentar:
Posting Komentar
Silahkan Beri Komentar... ^^