Baiklah kali ini saya
akan share tentang Cara membuat List Minimal dan List kombinasi Menggunakan
Kode HTML. Cara membuat List atau Daftar dengan kode HTML cukup
mudah kok, kalian harus mengetahui dulu kode dasar html klik Pengertian
HTML dan Kode Dasar HTML Bagi kalian yang belum mengerti.
Oke kita lanjutkan, list dalam kode html menggunakan tag :
1. <ol> </ol> = Ordered List (Membuat list dengan urutan contoh 1,2,3,.., a,b,c,... dll)
Attribut
tag ol : type
Value tag ol : 1, i, I, a, dan A
Contoh : <ol type='i'><li> Ade Putra Blo</li><ol>
Value tag ol : 1, i, I, a, dan A
Contoh : <ol type='i'><li> Ade Putra Blo</li><ol>
2.
<ul> </ul> = Unordered list (membuat list tanpa
orutan lihat screenshot pada gambar.
Attribut
tag ul : type
Value tag ul : disc, circle, dan square
contoh : <ul type='square'><li> Ade Putra Blo</li><ul>
Value tag ul : disc, circle, dan square
contoh : <ul type='square'><li> Ade Putra Blo</li><ul>
3. <li></li> = Tag li berfungsi untuk menampilkan kalimat yang ingin kita buat.Tag li disisipkan diantara tag ol ataupun tag ul
contoh :
<ol>
<li>teks </li>
li>teks 2 </li>
li>teks dsb. </li>
</ol>
<li>teks </li>
li>teks 2 </li>
li>teks dsb. </li>
</ol>
Cara Membuat List Minimal
<html>
<head>
<title>Membuat list minimal</title>
</head>
<body>
<ol>
<li>teks </li>
<li>teks 2 </li>
<li>teks dsb. </li>
</ol>
</body>
</html>
<head>
<title>Membuat list minimal</title>
</head>
<body>
<ol>
<li>teks </li>
<li>teks 2 </li>
<li>teks dsb. </li>
</ol>
</body>
</html>
Copy ke notepad dan
buka lewat browser kalian, maka tampilannya akan seperti gambar dibawah ini.
Kalian
bisa mengganti tag ol dengan ul dan juga menambahkan attribut sesuai dengan
kreasi kalian masing-masing.
Cara Membuat List Kombinasi.
Membuat list kombinasi saya rasa tidak cukup sulit, hanya saja kita harus meletakkan kodenya dengan teliti agar list yang kita buat tidak kacau. Kita akan membuat list kombinasi sesuai seperti gambar dibawah.
Cara Membuat List Kombinasi.
Membuat list kombinasi saya rasa tidak cukup sulit, hanya saja kita harus meletakkan kodenya dengan teliti agar list yang kita buat tidak kacau. Kita akan membuat list kombinasi sesuai seperti gambar dibawah.
Pertama, tulis atau copy kode dibawah dengan notepad kalian.
<html>
<head>
<title>Membuat list Kombinasi</title>
</head>
<body>
Daftar Makanan
<ol>
<li>Ayam </li>
<li>Soto </li>
</ol>
</body>
</html>
<head>
<title>Membuat list Kombinasi</title>
</head>
<body>
Daftar Makanan
<ol>
<li>Ayam </li>
<li>Soto </li>
</ol>
</body>
</html>
Simpan dan tampilkan di browser maka tampilannya akan seperti gambar dibawah.
Yang kedua adalah cara membuat submenu pada ayam dan soto. caranya yaitu dengan menyisipkan tag ol atau ul di dalam tag li pada ayam dan soto. Caranya seperti kode dibawah.
<html>
<head>
<title>Membuat list Kombinasi</title>
</head>
<body>
Daftar Makanan
<ol>
<li>Ayam
<ul>
<li type='circle'>Daging</li>
<li type='disc'>Bakar</li>
<li type='square'>Kecap</li>
</ul>
</li>
<li>Soto
<ol type='a'>
<li>Daging</li>
<li>Bakar</li>
</ol>
</li>
</ol>
</body>
</html>
<head>
<title>Membuat list Kombinasi</title>
</head>
<body>
Daftar Makanan
<ol>
<li>Ayam
<ul>
<li type='circle'>Daging</li>
<li type='disc'>Bakar</li>
<li type='square'>Kecap</li>
</ul>
</li>
<li>Soto
<ol type='a'>
<li>Daging</li>
<li>Bakar</li>
</ol>
</li>
</ol>
</body>
</html>
Sehingga tempilannya akan seperti gambar dibawah ini.
Bagaimana ? Mudah
bukan ? Jika kalian mengetahui dasar kode html, pasti membuat list minimal juga
akan terasa lebih mudah. Intinya, kalian harus benar menempatkan kodenya
sehingga browser bisa menampilkan hasil coding yang kalian buat.
Jika kalian masih kesulitan, Silakan contact saya atau tinggalkan komentar..
Jika kalian masih kesulitan, Silakan contact saya atau tinggalkan komentar..
Judul:
Cara membuat List Minimal dan List kombinasi Menggunakan Kode HTML
Author: Ade Putra
Rating: 4.5
Terbit: 20:07
Keyword :
Author: Ade Putra
Rating: 4.5
Terbit: 20:07
Keyword :
makasih ilmunya
ReplyDelete