Tutorial HTML <th>
Element HTML
th mendefinisikan sebagai header cell, secara default element ini mempunyai efek tampilan dengan teks tebal dengan posisi berada ditengah.
Contoh HTML <th>
Contoh 1 :
<table>
<tr>
<th>Nama</th>
<th>Umur</th>
</tr>
<tr>
<td>Andi</td>
<td>13 Tahun</td>
</tr>
<tr>
<td>Novy</td>
<td>14 Tahun</td>
</tr>
</table><!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Demo Triksonic</title>
<style>
table {
width: 100%;
border-collapse: collapse;
}
th, td {
border: 1px solid silver;
padding: 8px;
}
</style>
</head>
<body>
<table>
<tr>
<th>Nama</th>
<th>Umur</th>
</tr>
<tr>
<td>Andi</td>
<td>13 Tahun</td>
</tr>
<tr>
<td>Novy</td>
<td>14 Tahun</td>
</tr>
</table>
</body>
</html>Contoh 2 :
<table>
<thead>
<tr>
<th>Nama</th>
<th>Umur</th>
</tr>
</thead>
<tbody>
<tr>
<td>Andi</td>
<td>13 Tahun</td>
</tr>
<tr>
<td>Novy</td>
<td>14 Tahun</td>
</tr>
</tbody>
</table><!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Demo Triksonic</title>
<style>
table, th, td {
border: 1px solid silver;
}
</style>
</head>
<body>
<table>
<thead>
<tr>
<th>Nama</th>
<th>Umur</th>
</tr>
</thead>
<tbody>
<tr>
<td>Andi</td>
<td>13 Tahun</td>
</tr>
<tr>
<td>Novy</td>
<td>14 Tahun</td>
</tr>
</tbody>
</table>
</body>
</html>Attribute HTML <th>
| Attribute | Value | Keterangan |
|---|---|---|
| abbr | Teks | Attribute ini tidak support pada HTML 5. Attribute ini digunakan untuk memberikan keterangan singkatan dari kontent yang ada didalam element <th> |
| align | leftrightcenterjustifychar | Attribute ini tidak support pada HTML 5. Attribute ini digunakan untuk keselarasan atau posisi. |
| axis | Jenis kategori | Attribute ini tidak support pada HTML 5. Attribute ini digunakan untuk menambahkan kategori pada element <th>. |
| bgcolor | Kode warna | Attribute ini tidak support pada HTML 5. Attribute ini digunakan untuk menentukan warna latar / background |
| char | Karakter | Attribute ini tidak support pada HTML 5. Attribute ini digunakan untuk menentukan karakter agar selaras antara cell dengan kolom. Attribute ini tidak support untuk browser terkenal manapun |
| charoff | Angka | Attribute ini tidak support pada HTML 5. Attribute ini digunakan digunakan untuk menentukan jumlah karakter dan sebagai kontrol dari attribute char. Attribute ini tidak support untuk browser terkenal manapun |
colspan | Angka | Attribute ini digunakan untuk memperpanjang kolom cell. |
headers | header_id | Attribute ini digunakan jika element <th> yang satu dengan yang lainnya terpisah atau berbeda element <tr> sebagai pembungkusnya. |
| height | pixels % | Attribute ini tidak support pada HTML 5. Digunakan untuk menentukan tinggi element |
| nowrap | nowrap | Attribute ini tidak support pada HTML 5. Attribute ini digunakan untuk menentukan apakah teks didalam element <th> akan dijatuhkan atau tidak. |
rowspan | number | Attribute ini digunakan untuk melipat cell |
scope | colcolgrouprowrowgroup | Attribute ini digunakan untuk menentukan apakah cell diperuntukkan untuk kolom, baris, grup kolom atau grup baris. |
| valign | topmiddlebottombaseline | Attribute ini tidak support pada HTML 5. Attribute ini digunakan untuk menentukan keselarasan teks pada setiap baris cell |
| width | pixels % | Attribute ini tidak support pada HTML 5. Attribute ini digunakan untuk menentukan lebar element <th>. |
Global Attributes:
Element <th> mencakup Global Attributes HTML.
Event Attributes:
Element <th> mencakup Event Attributes HTML.
Browser Support HTML <th>
Desktop
| Element | Chrome | Safari | Firefox | Opera | IE | Edge |
<th> | 1 | Ya | 1 | Ya | Ya | Ya |
Mobile
| Element | Android webview | Chrome Android | Edge mobile | Firefox Android | IE mobile | Opera Android | iOS Safari |
<th> | Ya | Ya | Ya | 4 | Ya | Ya | Ya |
Default CSS :
Browser yang support dengan element
<th>, mempunyai nilai default :th {
display: table-cell;
vertical-align: inherit;
font-weight: bold;
text-align: center;
}