Pemrograman Web 3.3
FORMAT
TABEL HALAMAN WEB
Tabel merupakan
cara untuk menampilkan informasi dalam bentuk sel yang
terdiri atas baris dan kolom.
Untuk menampilkan data dalam bentuk table pada HTML, digunakan Tag <Table>.
Elemen
table berisi property <tr> untuk menentukan baris (table row) yang
didalamnya terdapat properti
<td> untuk menampkan data pada setiap sel
table (table data).
Tag dan Fungsi
<table> ….. </table>
Mendifinisikan atau memanggil fungsi Tabel
<tr> … </tr>
Mendifinisikan table row atau baris (membuat baris)
<td> … </td> Data
pada tabel/sel (membuat kolom)
Atribut
Elemen Tabel
·
Width
=panjang(lebar table, pixel
atau persen)
·
Height
=panjang(tinggi
table, pixel atau persen)
·
Border
=pixel(tebal garis tepi)
·
Align
=[left|center|right](perataan
table)
·
Bgcolor
=warna(warna latar belakang
table)
Contoh
tag pembuatan tabel:
<html>
<head>
<title> Buat Tabel
</title>
</head>
<body>
<table border=1>
<tr>
<td> Tanggal
<td> Jam </tr>
<tr>
<td> 27 Oktober 2016
<td> 08.00 </tr>
</table>
</body>
</html>
Hasilnya :
|
Tanggal
|
Jam
|
|
27 Oktober
2016
|
08.00
|
Contoh 2:
<html>
<head>
<title>
Buat Tabel2 </title>
</head>
<body>
<table
border=1>
<tr>
<td>
Cell 1-Baris 1 Kolom 1
<td>
Cell 2-Baris 1 Kolom 2 </tr>
<tr>
<td>
Cell 3-Baris 2 Kolom 1
<td>
Cell 4-Baris 2 Kolom 2</tr>
<tr>
<td>
Cell 5-Baris 3 Kolom 1
<td>
Cell 6-Baris 3 Kolom 2 </tr>
</table>
</body>
</html>
Hasilnya :
|
Cell
1-Baris 1 Kolom 1
|
Cell 2-Baris
1 Kolom 2
|
|
Cell 3-Baris
2 Kolom 1
|
Cell 4-Baris
2 Kolom 2
|
|
Cell 5-Baris
3 Kolom 1
|
Cell 6-Baris
3 Kolom 2
|
·
Colspan =
menggabungkan 2 atau lebih kolom menjadi satu pada baris yang sama.
·
Rowspan = menggabungkan 2 atau lebih baris
menjadi 1
Contoh :
<html>
<head>
<title> Buat Tabel
</title>
</head>
<body>
<table border=1>
<tr>
<td colspan="3">
Tiga kolom </tr>
<tr>
<td rowspan="2">
Dua baris
<td colspan="2">
Dua kolom</tr>
<tr>
<td> Utuh
<td> Utuh </tr>
</table>
</body>
</html>
Hasilnya :
Komentar
Posting Komentar