IN021 Pemrograman Web 1 04- HTML Table

List

3 macam List :

Ordered List : list yang menggunakan nomor berdasarkan urutan

(numbering)

Unordered List : list yang tidak berurut dan menggunakan bullet

(bullets)

Definition List : list yang disertai dengan deskripsi dari setiap

item. Deskripsi dari item akan ditampilkan dengan indentasi

inchi menjorok ke dalam

Ordered List : tells the browser that list items will follow, and

to render them using a sequenced value.

: describes each list item

Attribute ... Nilai Attribute

Number

Tipe number type

start

Ordered List (Example) Item pertama Item kedua Item ketiga Item keempat

Item pertama Item kedua sub item pertama sub item kedua Item ketiga Item keempat

Unordered List : tells the browser that list items will follow, and

to render them as a bulleted list

: describes each list item Attribute ... Nilai Attribute

Tipe bullets

disc (default)

circle

square

type

Unordered List (Example)

A nested List: Coffee Tea Black tea Green tea China Africa Milk

Definition List

: data term, tag is used to render the term to define

: deskripsi dari item pada tag

A Definition List: Coffee Black hot drink Milk White cold drink

Table Menyusun data dalam baris dan kolom

Membuat layout untuk halaman web

Struktur Table

. . .

. . . atau . . .

Tag : elemen utama yang mengenkapsulasi semua komponen

dalam tabel

Tag berisi tag lain yang membantu dalam membentuk struktur table

Attribute

border

Nilai Attribute

px atau %

px atau %

px

px

px

left, right, center

pre-define color / HEX

file gambar

pre-define color / HEX

width

height

cellspacing

cellpadding

align

bgcolor

bordercolor

background

Keterangan

Lebar table

Tinggi table

Ukuran bingkai table

Jarak antar kolom

Jarak bingkai dengan content

Posisi table dalam 1 halaman

Background warna

Background gambar

Warna bingkai table

Memberikan judul untuk table

Diletakan dalam tag

Implementasi :

Schedule

Attribute Nilai Attribute

align bottom, center, left, right, top

Table Row

Menyatakan baris baru dalam table

Tag berisi kumpulan cell (tag )

1 tag = 1 baris

Attribute

bgcolor

Nilai Attribute

left, right, center

top, middle, bottom

pre-define color / HEX

pre-define color / HEX

px

align

valign

bordercolor

Keterangan

Perataan text secara horizontal

Perataan text secara vertikal

Background warna

Warna bingkai 1 baris

Tinggi baris

height

Table Cell Menyatakan sebuah kolom dalam 1 baris

Berada dalam tag

1 tag = 1 kolom

Attribute

bgcolor

Nilai Attribute

number

number

pre-define color / HEX

left, right, center

bottom, middle, top

nama file

px

px

px

rowspan

colspan

align

Keterangan

Menyatukan beberapa baris

Menyatukan beberapa kolom

Background warna

Perataan text secara horizontal

Perataan text secara vertikal

Background image

Lebar cell

Tinggi cell

Warna bingkai 1 cell

background

width

height

valign

bordercolor

Column Header Browsers render the tag as centered in the column

and in boldface font.

Memiliki atribut yang sama dengan tag

Schedule Time Class Room Instructor

Contoh My Schedule Time Class Room Instructor 8:00 Web Development OEH 113 Lee Cottrell 9:00 Java Programming Thackeray 720 Les Graves

12:00 Marketing Benedum 23 Gina Czina

Caption

Column header

Latihan 1 Buatlah list sesuai tampilan dibawah ini

Latihan 2