in

Membuat table di HTML


Sekarang kali ini kita akan belajar cara membuat table di HTML . Di dalam sebuah table kita memiliki yang namanya baris dan kolom , tentu kawan kawan sudah pada mengetahuinya baris dan kolom .

Table ini berguna salah satunya kita bisa membuat template dengan menggunakan table , tetapi mungkin sekarang sudah tidak ada lagi sebuah website yang templatenya table . Jadi untuk membuat template sekarang kita gunakan css dan html . Oke kembali lagi ke table .  Untuk membuat table kita gunakan tag <table> dan untuk barisnya kita gunakan tag <tr> dan untuk kolomnya kita gunakan yang namanya tag <td> atau tag <th> . Biasanya tag <th> digunakan untuk membuat judul dari setiap kolomnya .

Untuk membuat table di html mudah sekali seperti hanya artikel sebelumnya membuat list di html . 

Baca juga membuat list di HTML

Oke sekarang kita coba contohnya

<!doctype HTML>
<html>
<head>
<title>Membuat table </title>
</head>
<body>
<table border=”1px”>
<tr>
<th>no</th>
<th>nama</th>
<th>pangkat</th>
</tr>
<tr>
<td>1</td>
<td>Sasuke</td>
<td>Genin</td>
</tr>
<tr>
<td>2</td>
<td>Naruto</td>
<td>Genin</td>
</tr>
<tr>
<td>3</td>
<td>Sakura</td>
<td>Jonin</td>
</tr>
<tr>
<td>4</td>
<td>Kakashi</td>
<td>Jonin</td>
</tr>
</table>
</body>
</html>

Nulisanya banyak tapi tampilnya hanya sedikit , ya . ( derita )

kenapa kita di bagian 
<table border=”1px”>

Kita pakai atribut border , karena jika tidak maka tidak akan terlihat bawah itu merupakan sebuah table .Kalo kita coba hapus  border=”1px” maka tidak akan tampil garsinya dan tidak terlihat bahwa itu adalah table .
Seperti hanya list , di table ini juga bisa ada table di dalam table . contohnya 
<!doctype HTML><html><head> <title>Membuat table </title></head><body><table border=”1px”> <tr> <th>no</th> <th>nama</th> <th>Nilai</th> </tr> <tr> <td>1</td> <td>Sasuke</td> <td> <table border=”1px”> <tr> <th>pelajaran</th> <th>nilai</th> </tr> <tr> <td>Jutsu</td> <td>A</td> </tr> <tr> <td>Taijutsu</td> <td>A</td> </tr> </table> </td> </tr> <tr> <td>2</td> <td>Naruto</td> <td> <table border=”1px”> <tr> <th>pelajaran</th> <th>nilai</th> </tr> <tr> <td>Jutsu</td> <td>C</td> </tr> <tr> <td>Taijutsu</td> <td>C</td> </tr> </table> </td> </tr> <tr> <td>3</td> <td>Sakura</td> <td> <table border=”1px”> <tr> <th>pelajaran</th> <th>nilai</th> </tr> <tr> <td>Jutsu</td> <td>b</td> </tr> <tr> <td>Taijutsu</td> <td>A</td> </tr> </table> </td> </tr> <tr> <td>4</td> <td>Kakashi</td> <td> <table border=”1px”> <tr> <th>pelajaran</th> <th>nilai</th> </tr> <tr> <td>Jutsu</td> <td>A</td> </tr> <tr> <td>Taijutsu</td> <td>A</td> </tr> </table> </td> </tr></table></body></html>
Maka hasilnya 

Oke mungkin itu dia bagaimana cara membuat table di html . Seperti tadi saya bilang bahwa table ini agak mirip mirip sama list . Terima kasih telah berkenan membaca artikel ini . Sampai jumpa di artikel yang lainnya yang lebih menarik dan juga lebih bermanfaat . 

Written by admin