Tahap 11: Lebih lanjut tentang tabel ~ SERSAN

Judul "Lebih tentang tabel" mungkin terdengar membosankan bit. Tapi lihat sisi positif, ketika Anda tabel master, ada apa-apa tentang HTML yang akan merobohkan Anda.

Apa yang tersisa?

Dua atribut colspan dan rowspan digunakan ketika Anda ingin membuat tabel mewah.
Colspan adalah singkatan dari "rentang kolom". Colspan digunakan dalam <td> tag untuk menentukan berapa banyak kolom sel harus mencakup:
Contoh 1:

 <table border="1"> <tr> <td colspan="3">Cell 1</td> </tr> <tr> <td>Cell 2</td> <td>Cell 3</td> <td>Cell 4</td> </tr> </table>
 <table border="1"> <tr> <td colspan="3">Cell 1</td> </tr> <tr> <td>Cell 2</td> <td>Cell 3</td> <td>Cell 4</td> </tr> </table>

Akan terlihat seperti ini di browser:

Sel 1
Sel 2	Sel 3	Sel 4

Dengan pengaturan colspan untuk "3", sel pada baris pertama mencakup tiga kolom. Jika kita bukannya telah menetapkan colspan untuk "2", sel hanya akan berlangsung dua kolom dan itu akan menjadi diperlukan untuk menyisipkan sel tambahan pada baris pertama sehingga jumlah kolom akan cocok dalam dua baris.
Contoh 2:

 <table border="1"> <tr> <td colspan="2">Cell 1</td> <td>Cell 2</td> </tr> <tr> <td>Cell 3</td> <td>Cell 4</td> <td>Cell 5</td> </tr> </table>
 <table border="1"> <tr> <td colspan="2">Cell 1</td> <td>Cell 2</td> </tr> <tr> <td>Cell 3</td> <td>Cell 4</td> <td>Cell 5</td> </tr> </table>

Akan terlihat seperti ini di browser:

Sel 1		Sel 2
Sel 3	Sel 4	Your 5

Bagaimana dengan rowspan?

Seperti yang Anda sudah bisa anda duga, rowspan menentukan berapa banyak baris sel harus mencakup atas:
Contoh 3:

 <table border="1"> <tr> <td rowspan="3">Cell 1</td> <td>Cell 2</td> </tr> <tr> <td>Cell 3</td> </tr> <tr> <td>Cell 4</td> </tr> </table>
 <table border="1"> <tr> <td rowspan="3">Cell 1</td> <td>Cell 2</td> </tr> <tr> <td>Cell 3</td> </tr> <tr> <td>Cell 4</td> </tr> </table>

Akan terlihat seperti ini di browser:

Sel 1	Sel 2
	Sel 3
	Sel 4

Dalam contoh di atas rowspan diatur ke "3" di Cell 1. Ini menentukan bahwa sel harus menjangkau lebih dari 3 baris (baris sendiri ditambah dengan dua tambahan). Sel 1 dan 2 adalah your sehingga pada baris yang sama, sementara your 3 dan 4 your bentuk dua baris independen.
Bingung? Yah, tidak rumit dan mudah untuk kehilangan jejak. Oleh karena itu, mungkin ide yang baik untuk menarik Tabel di selembar kertas sebelum Anda mulai dengan HTML.
Tidak bingung? Lalu pergi ke depan dan membuat beberapa tabel dengan kedua colspan dan rowspan sendiri.

These icons link to social bookmarking sites where readers can share and discover new web pages.