Kalau kita ingin mengatur letak table tetap berada dibagian kiri layar, kita tidak perlu menambahkan kode <div align="#"> dan </div>. Tapi kalau ingin memindahkan table kebagian tengah layar monitor maka perlu ditambahkan kode <div align="center"> atau cukup dengan kode <center> dan </center>.
Sedangkan untuk menaruh table kebagian kanan gambar,maka kodenya adalah <div align="right"> dan </div>
Mari sekarang kita letakkan table dibagian tengah layar.
Pertama kita taruh kode <div align="center"> diatas kode <table> dan kode </div> dibawah kode </table>
Sebagai contoh kali ini table nya akan saya perkecil lebarnya menjadi 300px dan kolom artikel ini saya gunakan se-olah2 sebagai lebar layar monitor computer.
Sekarang kode HTML nya saya buat seperti dibawah ini:
<html>Dan sekarang hasilnya menjadi seperti ini:
<head>
<title>Belajar HTML Table</title>
</head>
<body>
<div align="center">
<table border="2" width=”300″>
<tr>
<td colspan="3" bgcolor="#FF9900">Kolom 1+2+3 </td>
</tr>
<tr>
<td rowspan="2">Kolom 1A<br />+Kolom 1B</td>
<td>Kolom 2A</td>
<td>Kolom 3A<br />+Kolom 3B</td>
</tr>
<tr>
<td width="100" height="137">
<img title="Hawaiian Girl" src="Hawaiian-Girl.jpg" alt="Hawaiian Girl">
</td>
</tr>
<tr>
<td>Kolom 1C</td><td>Kolom 2C</td><td>Kolom 3C</td>
</tr>
</table>
</div>
</body>
</html>
Untuk mengatur letak Table disebelah kanan hanya perlu mengganti "center" dengan "right"
Dan hasilnya akan menjadi seperti ini:
Untuk mengatur letak Table disebelah kiri tidak perlu menuliskan kode <div align="left">
Tapi kalau mau diisi dengan <div align="left"> juga boleh. Sama sekali tidak akan ada pengaruhnya, sebab secara default letak Table adalah dibagian sebelah kiri screen monitor.
Letaknya akan tetap seperti ini:
http://belajarhtmltable.com/mengatur-letak-table/#more-275
Tidak ada komentar:
Posting Komentar