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 | 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 |
Komentar