Belajar HTML - Membuat Tabel

Ditulis oleh Riedayme
- 0 Komentar

table berfungsi untuk menampilkan data agar data dapat dibaca dengan mudah, untuk membuat table dengan menggunakan tag <table></table>

penulisan kode :
<table>
<caption>Toufu Farm</caption>
<thead>
 <tr>
  <th>Daftar Menu</th>
  <th>Harga</th>
 </tr>
</thead>
<tbody>
 <tr>
  <td>Strawbery</td>
  <td>$15</td>
 </tr>
 <tr>
  <td>Tomat</td>
  <td>$15</td>
 </tr>  
 <tr>
  <td>Nanas</td>
  <td>$15</td>
 </tr>  
</tbody>
<tfoot>
 <tr>
  <th colspan="2">*Harga dapat berubah</th>
 </tr>
</tfoot>
</table>

pembahasan fungsi tag yang ada pada table

tag table
mendefinisikan tabel

tag thead
membuat grup tabel bagian kepala

tag tbody
membuat grup tabel bagian badan

tag tfoot
membuat grup tabel bagian kaki

tag th
mendefinisikan kolom

tag tr
mendefinisikan baris

tag td
mendifinisikan kolom

tag caption
memberi penjelasan pada tabel

atribut table


atribut tag table (tidak support html 5)
atribut fungsi nilai
align rotasi text left,center,right
bgcolor menambahkan background color rgb(),#kodewarna,namawarna
border memberi border 0, 1
cellpadding memberi jarak dalam kolom px
cellspacing memberi jarak luar kolom px
frame memberi bingkai void, above, below, hsides, lhs, rhs, vsides, box, border
rules memberi garis none, groups, rows, cols, all
sumamry memberi tulisan pendek text
width ukuran table px, %

fungsi rowspan dan colspan pada tag th dan td

fungsi dari rowspan adalah untuk menggabungkan kolom yang mengarah kebawah menjadi satu. sedangkan fungsi colspan untuk menggabungkan kolom yang mengarah kesamping menjadi satu.

contoh tabel dengan rowspan

angka huruf lainnya
1 a data
2 b
3 c

contoh tabel dengan colspan

angka huruf
1 a
2 b
3 c
data
Terbaru
Postingan Lebih Baru
Terlama
Postingan Lama

Komentar