HTML Table dengan Pixel Berbeda Setiap Kolom

Membuat table untuk blog pos memerlukan kode HTML tertentu. Bisa saja membuat dulu di Word lalu dipindah di blog pos, namun biasanya hasilnya berantakan. Kalau membuat table di Wordpress biasanya lebih gampang, karena langsung copy paste dari word dan hasilnya juga rapi bahkan bisa responsive.

Akan tetapi biasanya pixel dari setiap kolom akan menyesuaikan dengan item yang (gambar dan tulisan) yang ada pada tabel tersebut. Alhasil table kurang rapi jika dalam satu pos ada banyak table yang berbeda - beda.

Solusinya adalah dengan menggunakan table yang sudah diatur pixelnya. Maka berikut ini adalah HTML Table yang sudah ada pixelnya yang di dapat dari http://www.corelangs.com/html/tables/width-height.html

HTML Table 1 Row 2 Kolom

Berikut ini adalah contoh table 1 row 2 kolom dengan lebar (width) 100 persen sehingga bisa tetap responsive.

Contoh

Cell width is 30%

Cell width is 70%

Kode
<table border=1 width=100%>
<tr>
<td width=30%>
Cell width is 30%
</td>
<td width=70%>
Cell width is 70%
</td>
</tr>
</table>

HTML Table 5 Row 2 Kolom

Berikut ini adalah contoh table 1 row 2 kolom dengan lebar (width) 100 persen sehingga bisa tetap responsive.

Contoh

Item	Keterangan
Cell width is 30%	Cell width is 70%
Cell width is 30%	Cell width is 70%
Cell width is 30%	Cell width is 70%
Cell width is 30%	Cell width is 70%

Kode
<table border="1" style="width: 100%;"><tbody>
<tr><td width="30%"><b>Item</b></td><td width="70%"><b>Keterangan</b></td></tr>
<tr><td width="30%">Cell width is 30%</td><td width="70%">Cell width is 70%</td></tr>
<tr><td width="30%">Cell width is 30%</td><td width="70%">Cell width is 70%</td></tr>
<tr><td width="30%">Cell width is 30%</td><td width="70%">Cell width is 70%</td></tr>
<tr><td width="30%">Cell width is 30%</td><td width="70%">Cell width is 70%</td></tr>
</tbody></table>

HTML Table 5 Row 3 Kolom

Berikut ini adalah contoh table 1 row 2 kolom dengan lebar (width) 100 persen sehingga bisa tetap responsive.

Contoh

No.	Item	Keterangan
Cell width is 30%	Cell width is 40%	Cell width is 30%
Cell width is 30%	Cell width is 40%	Cell width is 30%
Cell width is 30%	Cell width is 40%	Cell width is 30%
Cell width is 30%	Cell width is 40%	Cell width is 30%

Kode
<table border="1" style="width: 100%;"><tbody>
<tr><td width="30%"><b>No.</b></td><td width="40%"><b>Item</b></td><td width="30%"><b>Keterangan</b></td></tr>
<tr><td width="30%">Cell width is 30%</td><td width="40%">Cell width is 40%</td><td width="70%">Cell width is 30%</td></tr>
<tr><td width="30%">Cell width is 30%</td><td width="40%">Cell width is 40%</td><td width="70%">Cell width is 30%</td></tr>
<tr><td width="30%">Cell width is 30%</td><td width="40%">Cell width is 40%</td><td width="70%">Cell width is 30%</td></tr>
<tr><td width="30%">Cell width is 30%</td><td width="40%">Cell width is 40%</td><td width="70%">Cell width is 30%</td></tr>

</tbody></table>