Belajar Element HTML: <td>

Tag <td> mewakili sel data (data tabel) dalam tabel HTML.

Elemen <td> digunakan dengan elemen <table> (dan elemen <tr>) untuk memungkinkan data disajikan dalam tabel.

Syntax

Tag <td> ditulis seperti <td></td> dengan data tabel dimasukkan diantara tag pembuka dan penutup.

Tag td ini harus merupakn anak dari tag <tr>.

Seperti ini:

<table>
	<tr>
		<td>Cell 1</td>
		<td>Cell 2</td>
	</tr>
</table>
<table>
  <thead>
    <tr>
      <th colspan="4">World Cup winners</th>
    </tr>
    <tr>
      <td colspan="2">Location</td>
      <td colspan="2">Score</td>
    </tr>
    <tr>
      <td>Continent</td>
      <td>Country</td>
      <td>First</td>
      <td>Total</td>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td rowspan="3">South America</td>
      <td>Uruguay</td>
      <td>1930</td>
      <td>2</td>
    </tr>
    <tr>
      <td>Brazil</td>
      <td>1958</td>
      <td>5</td>
    </tr>
    <tr>
      <td>Argentina</td>
      <td>1978</td>
      <td>2</td>
    </tr>
    <tr>
      <td rowspan="5">Europe</td>
      <td>Italy</td>
      <td>1934</td>
      <td>4</td>
    </tr>
    <tr>
      <td>Germany</td>
      <td>1954</td>
      <td>4</td>
    </tr>
    <tr>
      <td>England</td>
      <td>1966</td>
      <td>1</td>
    </tr>
    <tr>
      <td>France</td>
      <td>1998</td>
      <td>1</td>
    </tr>
    <tr>
      <td>Spain</td>
      <td>2010</td>
      <td>1</td>
    </tr>
  </tbody>
</table>

colspan

Menentukan berapa banyak kolom yang harus dipentang sel.

"3"

Kamu dapat menggunakan integer apa pun.

rowspan

Menentukan berapa banyak baris sel yang harus span.

"2"

Kamu dapat menggunakan integer apa pun.

Pengaturan Default CSS

Sebagian besar browser menampilkan elemen <td> dengan pengaturan CSS:

td {
  display: table-cell;
  vertical-align: inherit;
}