Sabtu, 30 November 2013

Penggunaan Colspan dan Rowspan

Penggunaan Colspan dan Rowspan.
Colspan berfungsi untuk menggabungkan kolom pada tabel, sedangkan rowspan berfungsi untuk menggabungkan baris pada tabel.

TABEL 1
Coding :
<!DOCTYPE html>
<html>
<head>
<title>Membuat Tabel</title>
</head>
<body>
<table border="1" width="400">
<caption>Tabel 1</caption>
<thead>
<tr>
<th>1</th><th>2</th><th>3</th>
</tr>
<tr>
<th>4</th><th>5</th><th>6</th>
</tr>
<tr>
<th>7</th><th>8</th><th>9</th>
</tr>
</table>
</body>
</html>
Hasil :


TABEL 2
Coding :
<!DOCTYPE html>
<html>
<head>
<title>Membuat Tabel</title>
</head>
<body>
<table border="1" width="400">
<caption>Tabel 2</caption>
<thead>
<tr>
<th>1</th><td colspan="2"><center>2</center></td>
</tr>
<tr>
<th>3</th><th>4</th><th>5</th>
</tr>
<tr>
<td colspan="2"><center>6</center></td><th>7</th>
</tr>
</table>
</body>
</html>
Hasil :


TABEL 3
Coding :
<!DOCTYPE html>
<html>
<head>
<title>Membuat Tabel</title>
</head>
<body>
<table border="1" width="400">
<caption>Tabel 3</caption>
<thead>
<tr>
<td colspan="3"><center>1</center></td>
</tr>
<tr>
<td colspan="2"><center>2</center><th>3</th>
</tr>
<tr>
<th>4</th><th>5</th><th>6</th>
</tr>
</table>
</body>
</html>
Hasil :


TABEL 4
Coding :
<!DOCTYPE html>
<html>
<head>
<title>Membuat Tabel</title>
</head>
<body>
<table border="1" width="400">
<caption>Tabel 4</caption>
<thead>
<tr>
<td rowspan="2"><center>1</center></td><th>2</th>
</tr>
<tr>
<th>3</th>
</tr>
</table>
</body>
</html>
Hasil :



TABEL 5
Coding :
<!DOCTYPE html>
<html>
<head>
<title>Membuat Tabel</title>
</head>
<body>
<table border="1" width="400">
<caption>Tabel 5</caption>
<thead>
<tr>
<th>1</th><td rowspan="2"><center>2</center></td>
</tr>
<tr>
<th>3</th>
</tr>
</table>
</body>
</html>
Hasil :


Tidak ada komentar:

Posting Komentar