Daftar/list
adalah merupakan kumpulan teks yang disusun sedemikian rupa sehingga item-item
yang ada memiliki nomor urut atau bisa juga berupa tanda-tanda khusus/symbol.
Terdapat tiga tipe list yang dapat digunakan, yaitu:
þ Unordered Lists: <UL> Untuk membuat daftar
item dengan tanda bullet (tidak bernomor). List entries didefinisikan dengan
tag <LI>. Pada jenis ini tidak
memerlukan pengurutan data.
Bentuk item tanda pada Unordered
List dapat diubah dengan menggunakan atribut TYPE kedalam tag <UL>
dengan nilai “circle” untuk bentuk lingkaran tengahnya putih, “square”
untuk bentuk kotak padat hitam dan “disc” bentuk lingkaran pada
warna hitam.
Sekarang untuk latihan pertama kita, mari kita buat dokumen HTML sederhana. Ikuti langkah-langkah berikut ini:
1. Buat direktori dengan nama latihan di drive C:. Dan selanjutnya dalam direktori ini kita akan menyimpan semua file-file latihan kita.
2. Buka Browser, misalnya Internet Explorer atau Netscape Navigator.
3. Buka program aplikasi teks editor misalnya dalam latihan ini adalah Notepad.
4. Mulai baris paling atas, tuliskan:
<html>
<head>
<title>Membuat Undordered List</title>
</head>
<body bgcolor=#fffccc>
<font size=1 Face=tahoma color=blue>Ravy Octhavy Yansen</font>
<hr size=1 width=150 align=left>
<h1>
<center>www.smkn1depok.sch.id</h1>
<div style="text-align:center;">
<img src="1dpk.jpg" alt="Logo SMKN1 DEPOK" width="100" height="100"></div>
<hr size=5 align=center noshade>
</body>
<body><b><font size=3 Face=tahoma color=blue> Jurusan SMKN1 DEPOK </b>
<hr size=2 width=150 align=left>
<ul type=circle>
<li>Rekayasa Perangkat Lunak
</ul>
<ul type=disc>
<li>Teknik Kendaraan Ringan
</ul>
<ul type=disc>
<li>Teknik Sepeda Motor
</ul>
<ul type=disc>
<li>TAkomodasi Perhotelan
</ul>
<ul type=disc>
<li>Akuntansi
</ul>
<ul type=disc>
<li>Multimedia
</ul>
</font>
</body>
</html>
<html>
<head>
<title>Membuat Undordered List</title>
</head>
<body bgcolor=#fffccc>
<font size=1 Face=tahoma color=blue>Ravy Octhavy Yansen</font>
<hr size=1 width=150 align=left>
<h1>
<center>www.smkn1depok.sch.id</h1>
<div style="text-align:center;">
<img src="1dpk.jpg" alt="Logo SMKN1 DEPOK" width="100" height="100"></div>
<hr size=5 align=center noshade>
</body>
<body><b><font size=3 Face=tahoma color=blue> Jurusan SMKN1 DEPOK </b>
<hr size=2 width=150 align=left>
<ul type=circle>
<li>Rekayasa Perangkat Lunak
</ul>
<ul type=disc>
<li>Teknik Kendaraan Ringan
</ul>
<ul type=disc>
<li>Teknik Sepeda Motor
</ul>
<ul type=disc>
<li>TAkomodasi Perhotelan
</ul>
<ul type=disc>
<li>Akuntansi
</ul>
<ul type=disc>
<li>Multimedia
</ul>
</font>
</body>
</html>
5. Simpan file anda dengan cara klik menu File – Save-As :
6. Pada box File name, isikan nama filenya dengan Latihan5.html
Untuk menjalankan kode-kode tersebut, silahkan buka browser seperti Internet Explorer, Mozila Firefox.
1. Klik menu File à Open
3. Klik tombol Open lalu tekan tombol Ok, halaman web yang ditampilkan dalam browser adalah seperti berikut:
Catatan:
File gambar harus satu folder dengan file html yang kita buat
File gambar harus satu folder dengan file html yang kita buat
0 komentar:
Posting Komentar