<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Demo Tabel</title>
</head>
<body>
<table border=1>
<!--Header-->
<tr>
<th>Numb</th>
<th>Name</th>
<th>Address</th>
</tr>
<!--Baris data pertama-->
<tr>
<td>1</td>
<td>Fathiya</td>
<td>Jl.Mayjend Panjaitan</td>
</tr>
</table>
</body>
</html>
Tampilan pada web browser:
Tabel dapat diformat sesuai kebutuhan, untuk itu sering digunakan atribut, yaitu: align (untuk mengatur posisi), cellspacing (untuk mengatur spasi antarsel), cellpadding (untuk mengatur spasi antara border sel dengan isinya). Kreasi bentuk tabel beragam sesuai dengan keinginan pendesain. Berikut ada sebuah contoh bentuk desain web berbasis tabel:
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Demo desain web dengan tabel</title>
</head>
<body>
<table border=1 align="center" cellspacing=0 cellpadding=10>
<tr>
<td width="800" td height="50" align="center" colspan=3 bgcolor="#C0C0C0"><b>Header</b>
</td>
</tr>
<tr>
<!--mengatur lebar kolom-->
<td width="200" td height="500" align="center" bgcolor="#FF69B4"><b>Left</b></td>
<td width="400" td height="500" align="center" bgcolor="#FF69B4"><b>Middle</b></td>
<td width="200" td height="500" align="center" bgcolor="#FF69B4"><b>Right</b></td>
</tr>
<!--Footer-->
<tr>
<td width="800" td height="50" colspan="3" bgcolor="#C0C0C0" align="center"><b>Footer</b></td>
</tr>
</table>
</body>
Tampilannya sebagai berikut:
Tidak ada komentar:
Posting Komentar