Tag HTML <tr>
Contoh
Tabel HTML sederhana dengan tiga baris; satu baris header dan dua baris data:
<table>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
<tr>
<td>February</td>
<td>$80</td>
</tr>
</table>
Lebih banyak contoh "Coba Sendiri" di bawah ini.
Definisi dan Penggunaan
Tag <tr>
mendefinisikan baris dalam tabel HTML.
Sebuah <tr>
elemen berisi satu atau lebih elemen <th> atau
<td> .
Dukungan Peramban
Element | |||||
---|---|---|---|---|---|
<tr> | Yes | Yes | Yes | Yes | Yes |
Atribut Global
Tag <tr>
juga mendukung Atribut Global dalam HTML .
Atribut Acara
Tag <tr>
juga mendukung Atribut Peristiwa dalam HTML .
Lebih Banyak Contoh
Contoh
Cara menyelaraskan konten di dalam <tr> (dengan CSS):
<table style="width:100%">
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr style="text-align:right">
<td>January</td>
<td>$100</td>
</tr>
</table>
Contoh
Cara menambahkan warna latar belakang ke baris tabel (dengan CSS):
<table>
<tr style="background-color:#FF0000">
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
Contoh
Cara menyelaraskan konten secara vertikal di dalam <tr> (dengan CSS):
<table style="height:200px">
<tr
style="vertical-align:top">
<th>Month</th>
<th>Savings</th>
</tr>
<tr style="vertical-align:bottom">
<td>January</td>
<td>$100</td>
</tr>
</table>
Contoh
Cara membuat header tabel:
<table>
<tr>
<th>Name</th>
<th>Email</th>
<th>Phone</th>
</tr>
<tr>
<td>John Doe</td>
<td>[email protected]</td>
<td>123-45-678</td>
</tr>
</table>
Contoh
Cara membuat tabel dengan keterangan:
<table>
<caption>Monthly savings</caption>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
<tr>
<td>February</td>
<td>$80</td>
</tr>
</table>
Contoh
Cara mendefinisikan sel tabel yang menjangkau lebih dari satu baris atau satu kolom:
<table>
<tr>
<th>Name</th>
<th>Email</th>
<th colspan="2">Phone</th>
</tr>
<tr>
<td>John Doe</td>
<td>[email protected]</td>
<td>123-45-678</td>
<td>212-00-546</td>
</tr>
</table>
Halaman Terkait
Tutorial HTML: Tabel HTML
Referensi DOM HTML: objek TableRow
Tutorial CSS: Menata Tabel
Pengaturan CSS Default
Sebagian besar browser akan menampilkan <tr>
elemen dengan nilai default berikut:
tr {
display: table-row;
vertical-align: inherit;
border-color: inherit;
}