Belajar HTML - HTML Table ( tabel )

Belajar HTML, bagaimana cara membuat table ( tabel ) pada document HTML.

contoh tabel pada html

HTML Tabel

Apples	44%
Bananas	23%
Oranges	13%
Other	10%

Tabel pada tag document HTML begitu berguna bagi anda yang suka berkreasi dengan dengan document - document HTML anda.

oke, sebelum kita lanjut lebih jauh tentang html tabel, kita lihat dahulu contoh sederhana penggunaan tabel pada document HTML secara langsung.

Tables
bagaimana cara membuat tabel pada html

Table borders
bagaimana cara membuat border ( tebal garis tepi ) pada tabel html

HTML TABEL

Tag Tabel pada document HTML di tulis dengan tag <table>


Sebuah tabel dibagi menjadi beberapa baris ( dengan tag <tr> ), dan setiap baris dibagi menjadi sel-sel data (dengan tag <td>). td singkatan dari "tabel data", dan memegang isi sel data. Sebuah tag <td>dapat berisi teks, link, gambar, daftar, bentuk, tabel lain, dll

contoh tabel

<table border="1">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>

Maka hasil dari contoh tabel di atas akan terlihat seperti di bawah ini :

row 1, cell 1	row 1, cell 2
row 2, cell 1	row 2, cell 2

HEADER TABEL HTML

Tag header dalam tabel didefinisikan dengan tag <th>.

Semua browser utama akan menampilkan teks dalam elemen<th> sebagai tebal dan terpusat .

contoh tabel header

<table border="1">
<tr>
<th>Header 1</th>
<th>Header 2</th>
</tr>
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>

Maka Hasil dari contoh tabel header di atas seperti di bawah ini :

Header 1	Header 2
row 1, cell 1	row 1, cell 2
row 2, cell 1	row 2, cell 2

oke, sekarang kita akan lihat berbagai contoh dari penggunaan tag tabel pada document html tersebut :

Tabel tanpa batas tepi
Cara membuat tabel tanpa batas tepi.

tabel header
Cara membuat header tabel.

Tabel dengan keterangan
Bagaimana menambahkan keterangan ke tabel.

Tabel sel dengan span lebih dari satu baris / kolom
Bagaimana untuk menentukan sel tabel yang mencakup lebih dari satu baris atau satu kolom.

Tag di dalam tabel
Bagaimana untuk menampilkan unsur-unsur di dalam unsur-unsur lain.

cell padding
Cara menggunakan cell padding untuk membuat jarak antara huruf dengan garis tepi (border).

cell spasi
Cara menggunakan cell spacing untuk meningkatkan jarak antara sel-sel.

Atribut frame 
Cara menggunakan " frame " atribut untuk mengontrol perbatasan di sekitar meja.



oke, kita akan lanjut ke tutorial belajar HTML selanjutnya ...

<< HTML Images (Gambar) : Sebelumnya                                       Selanjutnya : HTML List >>

>>Lihat Semua Artikel Belajar HTML