15 membuat list

Post on 09-Feb-2017

62 views 0 download

Transcript of 15 membuat list

MEMBUAT DAFTAR/ LIST

AMIROH, S.KomSMKN 3 JOMBANG

KONSEP DAFTAR/LIST Membuat Daftar/List adalah membuat

deretan teks yang tersusun rapi berdasarkan urutan nomor ataupun karakter/symbol tertentu

Ada 2 jenis list, yaitu Ordered list (OL), Unordered list (UL) dan Description List (DL)

Contoh sebuah daftar/list:

1. Ordered List (OL) OL (Ordered List) atau daftar berurut Digunakan untuk menampilkan daftar teks

yang memiliki nomor urut berupa “1”, ”A”, “a”, “I”, “i”

Masing-masing item dituliskan di antara tag List Item atau <li>

Type (dalam HTML) dan list-style-type (dalam CSS) adalah atribut/property list, yang digunakan untuk menentukan bentuk list-nya, yaitu:

CONTOH:

2. Unordered List (UL) UL (Unordered List) atau daftar

tidak berurut Digunakan untuk menampilkan daftar

teks yang tidak bernomor urut. UL memiliki atribut yang sama

dengan OL, yaitu Type (dalam HTML) dan list-style-type (dalam CSS), yang digunakan untuk menentukan tipe list-nya: Circle : Bulat Disc : Kotak Square : Kotak

Contoh

3. Description List (DL) Digunakan untuk menampilkan teks

beserta deskripsinya Contoh:

List Bertumpuk List dapat ditampilkan secara

bertumpuk seperti berikut:

Horizontal list

Horizontal List List dapat pula ditampilkan

dengan secara mendatar (tidak menurun/dalam 1 baris) dengan menggunakan Style CSS

Display:Inline; adalah property yang digunakan untuk menampilkan list secara mendatar.

List yang ditampilkan secara mendatar ini selanjutnya biasa digunakan untuk membuat “Menu Pilihan”

Contoh:

LATIHAN Buatlah tampilan list mendatar

seperti gambar berikut:

Gunakan style CSS untuk membuat warna background Hijau

THANK YOU