Membuat Kolom kotak Atau Thabel ini bisa Kita Gunakan di Halaman Blogweb maupun di layuot yang bisa kita letakan di bawah header Sebagai Latar Menu Navigasi. Bisa Juga Di Postingan terbaru, Bisa Juga Di manfaatkan Untuk Menyusun Foto berjajar Horizontal Dan Vertikal agar keliahatan Rapi...
Promo
Buku Bacaan Islami Dan Al-Qur'an ➡️
Saya akan bagikan script membikin tabel yang mudah di blog, baik di postingan maupun di beranda blog yang di selipkan pada widget Html di pengaturan louyut blogger.
Baca Juga:
☆ Game ' High Domino Island' Dan Fenomenanya.
☆ Menjadikan Hobi Sebagai Penghasilan Tambahan
/* CSS Post Table */ .post-body table td,.post-body table caption{border:1px solid #e9e9e9;padding:5px 10px;text-align:left;vertical-align:top;} .post-body table th {border:1px solid #e9e9e9;padding:10px;text-align:left;vertical-align:top;} .post-body table.tr-caption-container {border:1px solid #e9e9e9;} .post-body table caption{border:none;font-style:italic;} .post-body table{} .post-body td, .post-body th{vertical-align:top;text-align:left;font-size:13px;padding:3px 5px;} .post-body table tr:nth-child(even) > td {background-color:#f9f9f9;} .post-body table tr:nth-child(even) > td:hover {background-color:#0082d8;} .post-body th{background:#bcdbfe;font-weight:bold;text-transform:uppercase;font-size:14px} .post-body th:hover{background:#fdfdfd;} .post-body td a{color:#768187;padding:0 6px;font-size:85%;float:right;display:inline-block;border-radius:3px} .post-body td a:hover {color:#7f9bdf;border-color:#adbce0;} .post-body td a[target="_blank"]:after {margin-left:5px;} .post-body table.tr-caption-container td {border:none;padding:8px;} .post-body table.tr-caption-container, .post-body table.tr-caption-container img, .post-body img {max-width:100%;height:auto;} .post-body td.tr-caption {font-size:80%;padding:0px 8px 8px !important;} .post-body li {list-style-type:square;} img {max-width:100%;height:auto;border:none;} table {max-width:100%;width:100%;margin:1.5em auto;} table.section-columns td.first.columns-cell{border-left:none} table.section-columns{border:none;table-layout:fixed;width:100%;position:relative} table.columns-2 td.columns-cell{width:50%} table.columns-3 td.columns-cell{width:33.33%} table.columns-4 td.columns-cell{width:25%} table.section-columns td.columns-cell{vertical-align:top} table.tr-caption-container{padding:4px;margin-bottom:.5em} td.tr-caption{font-size:80%} .widget ul {padding:0;}
Kemudian Simpan / Save.
Langkah berikutnya Silahkan Masuk kepostingan Terbaru atau tambah widget html di louyut blogger. Copy kan script di bawah dan pastekan.
Kemudian tambahkan di loyout html bukan Kompose:
<table width="500" border="1">
<tr>
<td>Kolom 1 A </td>
<td>Kolom 1 B </td>
<td>Kolom 1 C </td>
</tr>
<tr>
<td>Kolom 2 A </td>
<td>Kolom 2 B </td>
<td>Kolom 2 C </td>
</tr>
<tr>
<td>Kolom 3 A </td>
<td>Kolom 3 B </td>
<td>Kolom 3 C </td>
</tr>
</table>
Promo Terlaris Bulan Ini :
Kolom 1 A sampai 3 C adalah Kotak table yang bisa anda isi dengan teks. Table di atas adalah kolom berisi 3 baris horizontal, dan tiga baris vertikal.
Sangat mudahkan ?, Sekian dulu penjelasan singkatnya, Wassallam..