Cara Membuat List (OL, UL, DL) Menggunakan HTML

-
Sobat tentunya sudah tidak asing dengan penggunaan bullet and numbering di Microsoft Word atau pembuatan list (daftar) lainnya dengan aplikasi office keluaran dari microsoft tersebut. Nah tutorial kali ini adalah pembuatan list, dimana ada 3 jenis list dalam dokumen HTML yaitu:


1. OL (Ordered List)

Tag <ol> adalah kependekan dari ordered list, yang artinya list secara berurutan. Pada tag <ol> list yang ditampilkan di browser berupa nomor disebelah kiri. Berikut contohnya, yang bisa sobat tulis menggunakan notepad, notepad+ dan sebagainya. Kalau saya pribadi sih lebih suka menggunakan notepad ++

Baca juga: tools yang diperlukan untuk memulai belajar HTML

<html>
<head>
<title>Membuat order list</title>
</head>
<body>
Tugas Budi Hari ini adalah:
<ol>
<li>Membaca Buku</li>
<li>merapikan kamar</li>
<li>membersihkan kamar mandi</li>
<li>Mandi yang bersih</li>
<li>menemani ibu ke pasar</li>
</ol>
</body>
</html>

Hasil dari kode HTML di atas, akan tampak seperti di bawah ini: 


Membuat order list


Tugas Budi Hari ini adalah:

    

  1. Membaca Buku
    2. 

  2. merapikan kamar
    3. 

  3. membersihkan kamar mandi
    4. 

  4. Mandi yang bersih
    5. 

  5. menemani ibu ke pasar
    6.
Secara default penggunaan tag <ol> pengurutan akan diurutan dengan angk. Bila sobat ingin mengurutkan dengan huruf atau romawi maka sobat tinggal menambahkan atribut type pada tag <ol>, seperti berikut ini: 
<html>
<head>
<title>Membuat order list</title>
</head>
<body>
Tugas Budi Hari ini adalah:
<ol type="A">
<li>Membaca Buku</li>
<li>merapikan kamar</li>
<li>membersihkan kamar mandi</li>
<li>Mandi yang bersih</li>
<li>menemani ibu ke pasar</li>
</ol>
</body>
</html>
Kode di atas, akan tampak seperti tampilan di bawah ini: 


Membuat order list

Tugas Budi Hari ini adalah:

    

  1. Membaca Buku
    2. 

  2. merapikan kamar
    3. 

  3. membersihkan kamar mandi
    4. 

  4. Mandi yang bersih
    5. 

  5. menemani ibu ke pasar
    6.

2. Unordered List <ul>

 Unordered List merupakan pengurutan list dengan menggunakan symbol/bullet. Cara membuatnya sama dengan ordered list hanya saja tag <ol> diganti dengan tag<ul>. Lihat pembuatan kode di bawah ini:
<html>
<head>
<title>Membuat unordered list</title>
</head>
<body>
Tugas Budi Hari ini adalah:
<ul>
<li>Membaca Buku</li>
<li>merapikan kamar</li>
<li>membersihkan kamar mandi</li>
<li>Mandi yang bersih</li>
<li>menemani ibu ke pasar</li>
</ul>
</body>
</html>
Hasilnya seperti di bawah ini: 


Membuat unordered list


Tugas Budi Hari ini adalah:

    

  • Membaca Buku
    • 

  • merapikan kamar
    • 

  • membersihkan kamar mandi
    • 

  • Mandi yang bersih
    • 

  • menemani ibu ke pasar
    •

3. List tanpa bullet

Penggunaan list tanpa bullet, caranya sama persis dengan pembuatan tag ol/ul, hanya saja tag <ul> diganti dengan <dl> lalu tag <li> diganti dengan <dd>, contoh: 
<pre class="prettyprint">
<head>
<title>Membuat tag dl </title>
</head>
<body>
Tugas Budi Hari ini adalah:
<dl type=>
<dd>Membaca Buku</dd>
<dd>merapikan kamar</dd>
<dd>membersihkan kamar mandi</dd>
<dd>Mandi yang bersih</dd>
<dd>menemani ibu ke pasar</dd>
</dl>
</body>
</html>
Hasilnya akan tampak seperti 


Membuat tag dl 


Tugas Budi Hari ini adalah:



Membaca Buku


merapikan kamar


membersihkan kamar mandi


Mandi yang bersih


menemani ibu ke pasar

Comments

Post a Comment

Popular posts from this blog

Pengertian dan Istilah Penting Pada Microsoft Access

-
Image
Microsoft Access merupakan bagian dari keluarga microsoft office, seperti halnya microsoft office word, excel, powerpoint, publisher, visio dan lain-lain. Kali ini, admin cari-cara belajar akan mengulas beberapa pengertian dan istilah penting yang ada pada microsoft access yang diproduksi oleh perusahaan raksasa Microsoft Corporation ini. Microsoft access atau lebih dikenal dengan sebutan Access merupakan salah satu perangkat lunak yang diperuntukkan untuk mengolah database di bawah sistem Windows. Dengan menggunakan Microsoft Access, seseorang dapat merancang, membuat, dan mengelola database dengan mudah dan cepat. Sampai saat tulisan ini diturunkan, versi terakhir dari microsoft access adalah Micrsoft access 2013. Blank database, digunakan untuk membuat data base baru yagn masih kosong dan rekan dapat menambahkan objek tabel, query, form, report, dan obyek lainnya. Blank data access page, dipakai untuk membuat database baru yang diberikan oleh Ms. Access secara bertahap. Pro
Read more

Perbedaan Antara BIOS dan OS (Sistem Operasi)

-
Image
Perbedaan Sistem Operasi dan Bios - Bios merupakan singkatan dari Basic Input Output System, perlu sobat ketahui BIOS adalah software kecil yang ditanam atau disimpan dalam sebuah memori ROM dengan jenis EPROM atau EEPROM, yang bertugas mengidentifikasi dan mengontrol perangkat kras/hardware yang terhubung pada motherboard , BIOS juga merupakan software yang berjalan pada memori yang terdiri dari semua driver yang meng-interface hardware ke sistem operasi. Sumber informasi yang diperoleh pada BIOS dapat diperoleh berasal dari beberapa sumber, yaitu sebagai berikut: ROM Motherboard ROM Card Adapter (seperti pada sound card, video card) Di load ke dalam RAM dari disk (device driver) BIOS ROM motherboad paling sering dikaitkan dengan hardware daripada software, ini karena pada BIOS di motherboad diisikan dalam sebuah chip ROM pada board, yang berisi driver software awal yang diperlukan untuk membuat sistem dapat berjalan. Bisa dikatakan BIOS adalah software yang mampu mengendala
Read more

Mengenal Manajemen File Windows

-
Image
Pengertian Manajemen File Manajemen file windows - File sistem atau manajemen file adalah metode dan struktur data yang digunakan sistem operasi untuk mengatur dan mengorganisir file pada disk atau partisi. File sistem juga dapat diartikan sebagai partisi atau disk yang digunakan untuk menyimpan file-file dalam cara tertentu. Cara memberi suatu file sistem ke dalam disk atau partisi, yaitu dengan melakukan format. Manfaat Manajemen File Manfaat manajemen file adalah dapat mengurangi risiko kehilangan file yang dikarenakan: terhapus secara tidak sengaja, tertimpa file baru, tersimpan di mana saja, dan hal lain yang tidak diinginkan. Sasaran Manajemen File Pengelolaan file adalah kumpulan perangkat lunak sistem yang menyediakan layanan berhubungan dengan dengan penggunaan file ke pemakai dan/atau aplikasi. Biasanya satu-satunya cara pemakai atau aplikasi mengakses file adalah lewat sistem. Pemakai atau pemogram tidak perlu mengembangkan perangkat lunak khusus untuk mengakses
Read more