Wednesday, May 6, 2020

√ Bagaimana Cara Menciptakan Table Yang Responsive Di Postingan Blog?

Membuat tabel di postingan blog cukup mudah tanpa harus memakai pluggin ibarat wordpress, pribadi saja kita ke pembahasan



Untuk lebih jelasnya aku sudah menciptakan postingan tabel yang sudah aku posting di blog ini,
bukan aku yang menciptakan sebenarnya alasannya aku cuma copy paste namun sedikit modifikasi.
Tabel tersebut aku tampilkan di bawah. Pada bab atas tabel tersebut ada
pemanis warna biru muda dan untuk warna goresan pena aku ganti menjadi putih. Kode orisinil dari postingan tabel sebelum aku edit sebagai berikut;

 <table 1px="" border="”2?" dashed="" style="width: ”100%”px;"> <tbody> <tr style="background-color: #117ac9; color: white;"> <td 1px="" dashed=""><b>Pos</b></td> <td 1px="" dashed=""><b>Tim</b></td> <td 1px="" dashed=""><b>Main</b></td> <td 1px="" dashed=""><b>M</b></td> <td 1px="" dashed=""><b>K</b></td> <td 1px="" dashed=""><b>Set</b></td> <td 1px="" dashed=""><b>Poin</b></td> </tr> <tr> <td 1px="" dashed="">1</td> <td 1px="" dashed="">Tontowi Ahmad/Lilyana Natsir</td> <td 1px="" dashed="">1</td> <td 1px="" dashed="">1</td> <td 1px="" dashed="">0</td> <td 1px="" dashed="">2-0</td> <td 1px="" dashed="">1</td> </tr> <tr> <td 1px="" dashed="">2</td> <td 1px="" dashed="">Chan Peng Soon/Goh Liu Ying</td> <td 1px="" dashed="">1</td> <td 1px="" dashed="">1</td> <td 1px="" dashed="">0</td> <td 1px="" dashed="">2-0</td> <td 1px="" dashed="">1</td> </tr> <tr> <td 1px="" dashed="">3</td> <td 1px="" dashed="">Bodin Issara/Savitree Amitrapai</td> <td 1px="" dashed="">1</td> <td 1px="" dashed="">1</td> <td 1px="" dashed="">0</td> <td 1px="" dashed="">0-2</td> <td 1px="" dashed="">1</td> </tr> <tr> <td 1px="" dashed="">4</td> <td 1px="" dashed="">Robin Middleton/Leanne Choo</td> <td 1px="" dashed="">1</td> <td 1px="" dashed="">1</td> <td 1px="" dashed="">0</td> <td 1px="" dashed="">0-2</td> <td 1px="" dashed="">1</td> </tr> </tbody></table> 

Hasil Jadi
Pos Tim Main M K Set Poin
1 Tontowi Ahmad/Lilyana Natsir 1 1 0 2-0 1
2 Chan Peng Soon/Goh Liu Ying 1 1 0 2-0 1
3 Bodin Issara/Savitree Amitrapai 1 1 0 0-2 1
4 Robin Middleton/Leanne Choo 1 1 0 0-2 1

catatan untuk background-color untuk memnerikan warna pada kolom tabel sedangkan color untuk memperlihatkan warna pada tulisan
Sumber http://www.warunginter.net/


EmoticonEmoticon