27 September 2016

Tabel dengan Spaning

Ada kalanya kita membuat table dengan menggabungkan baris, ataupun kolom. Berikut ini contoh tabel yang menggabungkan baris :

Berikut ini contoh tabel yang menggabungkan kolom :

Untuk membuat table seperti di atas, maka Tabel Atribut Data yang digunakan adalah sebagai berikut
Rowspan = angka(baris yang di span oleh sel) 
Colspan = angka(kolom yang di span oleh sel)

Jadi untuk menggabungkan 4 baris seperti table di atas adalah : 
<td rowspan="4"> …….</td>

Sedangkan untuk menggabungkan 4 kolom seperti table di atas adalah : 
<th colspan="4"> …….</th>

Tugas
1. Buatlah dokumen HTML berikut ini :
<html>
<head
<title>Tabel Dengan Rowspan</title
</head
<body
    <table width="500" border="1"> 
        <tr
            <th scope="col">Nama Perumahan </th
            <th scope="col">Tipe / Luas tanah (m<sup>2</sup>)</th
        </tr
        <tr
            <td rowspan="4">Griya Indah Permai </td
            <td>21 / 60 </td
        </tr
        <tr
            <td>36 / 90 </td>
        </tr
        <tr
            <td>45 / 120 </td
        </tr
        <tr
            <td>54 / 120 </td
        </tr
     </table
</body
</html>

2. Buatlah dokumen HTML berikut ini : 
<html
<head
<title>Tabel dengan Colspan</title
</head
<body
  <table width="500" border="1"> 
    <tr
       <th scope="col">Perumahan</th
       <th colspan="4" scope="col">Tipe / Luas tanah (m<sup>2</sup>) </th
    </tr
    <tr>
       <td>Griya Indah Permai </td
       <td>21/60</td
       <td>36/90</td
       <td>45/120</td
       <td>54/120</td
    </tr
  </table
</body
</html>

3. Buatlah dokumen HTML dari tampilan tabel berikut ini :

4. Buatlah dokumen HTML dari tampilan tabel berikut ini :

No comments:

Post a Comment

Popular Posts