Pertemuan 2
Cara Membuat Daftar/List di HTML
Dalam HTML, tag list terdiri dari 2 jenis, ordered list (berurutan) dan unordered list (tidak berurutan). Ordered list akan ditampilkan dengan angka atau huruf, sedangkan unordered listdengan bulatan atau kotak.
Ordered list menggunakan tag <ol>
Unordered list menggunakan tag <ul>, sedangkan untuk
list sendiri menggunakan tag <li>.
Penjelasan ini akan lebih mudah jika menggunakan contoh.
Berikut adalah contoh kode HTML untuk membuat ordered list menggunakan tag<ol>:
<!DOCTYPE html>
<html>
<head>
<title>penggunaan tag list </title>
</head>
<body>
<h1>Tugas Akhir Kelompok TA 2017/1018 Pengembangan TI STT Pelita Bangsa </h1>
<ol>
<li>Latar Belakang</li>
<li>Rumusan Masalah</li>
<li>Tujuan</li>
<li>Batasan Masalah</li>
</ol>
</body>
</html>
Untuk membuat unordered list, tinggal ganti tag <ol> menjadi <ul>.
Berikut adalah contoh kode HTML untuk membuat unordered list menggunakan tag<ul>:
<!DOCTYPE html>
<html>
<head>
<title>penggunaan tag list </title>
</head>
<body>
<h1>Tugas Akhir Kelompok TA 2017/1018 Pengembangan TI STT Pelita Bangsa </h1>
<ul>
<li>Latar Belakang</li>
<li>Rumusan Masalah</li>
<li>Tujuan</li>
<li>Batasan Masalah</li>
</body>
</html>
kita tambahkan sedikit modifikasi lagi :
<!DOCTYPE html>
<html>
<head>
<title>pertemuan II</title>
<link href="/layout.css" type="text/css" rel="stylesheet">
<body bgcolor="BLUE">
<font color="red" face="verdana" size="20"></font>
<div id="header">
<center >
Tugas Akhir Kelompok TA 2017/1018 <br>
Pengembangan TI STT Pelita Bangsa <br>
</center>
<p>DAFTAR ISI</p>
<p> HALAMAN JUDUL</p>
<p> KATA PENGANTAR</p>
<p> DAFTAR ISI</p>
<li>BAB I PENDAHULUAN</li>
<ol>
<li>Latar Belakang </li>
<li>Pembatasan Masalah </li>
<li>Rumusan Masalah </li>
<li>Metode Penelitian </li>
<li>Sistematika Penulisan </li>
</ol>
<li>BAB II LANDASAN TEORI</li>
<ol>
<li>Pengertian Sistem </li>
<li>Pengertian Informasi </li>
</ol>
<li>BAB III HASIL DAN PEMBAHASAN</li>
<ol>
<li>Prosedur Sistem yang Berjalan </li>
<li>Usulan Perancangan Sistem </li>
</ol>
<li>BAB IV PENUTUP</li>
<ol>
<li>Kesimpulan </li>
<li>Saran </li>
</ol>
<li>DAFTAR PUSTAKA</li>
</head>
</body>
</html>
berikut bentuk tampilannya :
Sekian dari saya semoga bermanfaat.terima kasih,
Komentar
Posting Komentar