MODUL 2 - FORMAT TABLE HALAMAN WEB

MODUL 2 - FORMAT TABLE HALAMAN WEB

1.      HTML TABLE

A.    MATERI

ELEMENT TABLE

Element table befungsi untuk membuat data multidimensi yang terdiri atas kolom dan baris. Element ini mempunyai attribute seperti align, bgcolor, border, cellpadding(jarak antara tepi sel dengan isi sel),cellspacing(jarak antara sel), width(lebar tabel), height(tinggi tabel). Element TABLE berisikan element CAPTION, TH, TR dan TD.

ELEMENT CAPTION

Element CAPTION berfungsi untuk membuat judul dari tabel. Element ini harus berada di dalam element TABLE dan mempunyai attribute align dengan nilai top(judul terletak di atas tabel), dan bottom(judul terletak di bawah tabel).

ELEMENT TR (Table Row)

Element TR mendefinisikan baris pada tabel dan element ini harus berada di dalam element TABLE. Pada element TR terdapat element TH dan TD. Attribute yang terdapat pada element ini adalah align, valign(posisi vertikal), danbgcolor.

ELEMENT TH (Table Header) dan TD (Table Data)

Element TH dan TD merupakan elemen yang berisi informasi pada tabel. TH mendefinisikan isi sel sebagai header sel pada kolom tabel dan datanya tercetak tebal dan dengan posisi ditengah sel. Element TH dan TD ini harus terletak di dalam element TR. Attribute kedua element ini adalah align, valign, bgcolor, colspan, rowspan

B.     PRAKTIKUM

1.      Buat tabel untuk teks di bawah ini:

Output

Nama file: latihan4_1.html

Tugas tambahan:

-          Ganti ukuran cellpadding, cellspacing, border dengan lainnya.

-          Berikan nilai width dan height pada tabel hingga 100%.

2.      Dari Latihan 1 gantilah warna background baris tabel menjadi baris-1=green baris-2=yellow baris-3=red baris-4=blue

Output

Nama file : latihan4_2.html

Tugas tambahan:

Ubahlah align pada baris-2 kolom-1 dan baris-4 kolom-2 ke kanan.

3.      Buat tabel untuk teks di bawah ini:

Output

Nama file : latihan4_3.html

4.      Desain halaman web menggunakan tabel

Output

Nama file : latihan4_4.html

Tugas tambahan:

Lengkapilah desain halaman web diatas sesuai dengan kreasi masing-masing. Halaman web tersebut nantinya akan berisi data pribadi masing-masing.