Tabel dalam pembuatan website sangat dibutuhkan, tabel juga bisa membantu programmer dalam pembuatan template untuk tata letak bagian website seperti header dan footer, di samping itu tabel juga dapat menampilkan data dengan rapi sehingga lebih enak di pandang, dibawah ini adalah contoh kode dari tag table.
MENGGUNAKAN TABEL | |||
Dasar Penggunaan Tabel | |||
1 | <table>.....</table> | Mengawali dan mengakhiri sebuah tabel | |
2 | <caption>.....</caption> | Menentukan judul pada tabel | |
3 | <tr>.....</tr> | Membuat sebuah baris dalam tabel | |
4 | <th>.....</th> | Membuat judul kolom | |
5 | <Td>.....</td> | Membuat sebuah sel data pada kolom | |
Memberi Garis Pada Tabel | |||
1 | <table border = “1”>.....</table> | Tebal garis sebesar 1 | |
Meletakkan Judul di Bawah Tabel | |||
1 | <caption align = “bottom”> | Menampilkan judul dibawah tabel | |
Menentukan Warna Latar Belakang | |||
1 | <table bgcolor = “silver” border = “10”> .....</table> | Menambah warna latar belakang terhadap tabel | |
2 | <td bgcolor = “pink”>.....</td> | Menambah warna latar belakang terhadap sel | |
Menggabungkan Sel | |||
1 | <td rowspan = “3”>.....</td> | Menggabungkan beberapa baris sel | |
2 | <td colspan = “2”>.....</td> | Menggabungkan beberapa kolom | |
3 | <td colspan = “2” rowspan = “2”>.....</td> | Menggabungkan colspan dan rowspan | |
Mengatur Peletakan Teks Dalam Tabel <tr>, <th>, <td> | |||
1 | Align = “left” | Teks diatur rata kiri | |
2 | Align = “center” | Teks diatur rata tengah | |
3 | Align = “right” | Teks diatur rata kanan | |
Mengatur Tinggi Sel | |||
1 | <table border = “1” height = “150”>.....</table> | Mengatur tinggi tabel | |
2 | <th height = “50”>.....</th> | Mengatur tinggi sel | |
Menatur Teks pada Posisi Vertikal <th>, <tr>, <td> | |||
1 | Valign = “top” | Teks diletakkan di bagian atas pada sel | |
2 | Valign = “middle” | Teks diletakkan di bagian tengah pada sel | |
3 | Valign = “bottom” | Teks diletakkan di bagian bawah pada sel | |
Mengatur Lebar Tabel dan Sel | |||
1 | <td width = “200”>.....</td> | Mengatur lebar sel | |
Mengatur Jarak Pada Tabel | |||
1 | <table border = “50” cellspacing = “20” cellpadding = “10”>.....</table> | | |
0 komentar:
Posting Komentar