~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~SAYA MENDENGAR LALU SAYA LUPA ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ SAYA MEMBACA LALU SAYA INGAT ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ SAYA MELAKUKAN LALU SAYA MENGERTI~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

31 March 2015

Pelajaran 03 : Daftar atau List Pada HTML


Pembuatan daftar menggunakan tag <UL> atau tag <OL>. Tag <UL> digunakan untuk daftar bulet dan tanpa nomor baris, sedangkan tag <OL> digunakan untuk daftar yang memunculkan nomor baris. Ikuti penjelasannya sebagai berikut :
  • daftar dengan bullet tanpa nomor
  • daftar dengan nomor
  • daftar berbagai type penomoran
  • dafatar didalam daftar (daftar bersarang)

1. Tag daftar dengan bullet <ul>

Untuk pembuatan daftar dengan menggunakan bullet maka digunakan tag <ul> dan untuk memunculkan pada setiap barisnya digunakan tag <li>

Contoh penulisan tag <ul> :


<html>
<head>
<title>daftar dengan bullet</title>
</head>
<body>
Merek Motor
<ul>
 <li>Yamaha</li>
 <li>Kawasaki</li>
 <li>Suzuki</li>
 <li>Honda</li>
</ul>
</body>
</html>
 



2. Tag daftar dengan nomor <ol>

Untuk pembuatan daftar dengan menggunakan nomor maka digunakan tag <ol> dan untuk memunculkan pada setiap barisnya digunakan tag <li>

Contoh penulisan tag <ol> :


<html>
<head>
<title>daftar dengan nomor</title>
</head>
<body>
Merek Motor
<ol>
 <li>Honda</li>
 <li>Yamaha</li>
 <li>Kawasaki</li>
 <li>Suzuki</li>
</ol>
</body>
</html>
 



3. Tag daftar berbagai type

Untuk penomoran pada tiap baris dapat menggunakan beberapa type sebagai berikut :

<ul type="a"> atau <ol type="a"> : penomeran dengan huruf kecil
<ul type="A"> atau <ol type="A"> : penomeran dengan huruf besar
<ul type="i"> atau <ol type="i"> : penomeran dengan huruf romawi kecil
<ul type="I"> atau <ol TYPE="I"> : penomeran dengan huruf romawi besar

Contoh penulisan daftar dengan berbagai type :


<html>
<head>
<title>daftar dengan berbagai type</title>
</head>
<body>
Merek Motor
<ul type="a">
 <li>Honda</li>
 <li>Yamaha</li>
 <li>Kawasaki</li>
 <li>Suzuki</li>
</ul>

Merek Mobil
<ol type="I">
 <li>Isuzu</li>
 <li>Toyota</li>
 <li>BMW</li>
 <li>Suzuki</li>
</ol>
</body>
</html>
 



4. Tag daftar bersarang

Untuk membuat daftar bersarang dapat mengkombinasikan dari berbagai type daftar, untuk membuatnya ikuti contoh berikut.

Contoh penulisan daftar bersarang :


<html>
<head>
<title>daftar bersarang</title>
</head>
<body>
PIALA DUNIA
<ul type="I">
  <li>Group A</li>
    <ol>
      <li>Amerika</li>
      <li>Jepang</li>
      <li>Jerman</li>
      <li>Brasil</li>
    </ol>
  <li>Group B</li>
    <ol>
      <li>Italia</li>
      <li>Belanda</li>
      <li>Katar</li>
      <li>Pantai Gading</li>
    </ol>
  <li>Group C</li>
    <ol>
      <li>Spanyol</li>
      <li>Inggis</li>
      <li>Argentina</li>
      <li>Koreal</li>
    </ol>
</ul>
</body>
</html>


By Herman @SMKN3BuduranSDA



ARTIKEL TERKAIT:


BACA JUGA TULISAN MENARIK LAINNYA :

0 Komentar:

Post a Comment