Pada Artikel kali ini saya akan membagikan tutorial HTML tentang membuat tabel pada HTML.
Tabel merupakan struktur yang digunakan untuk menampilkan informasi dalam bentuk baris dan kolom. pada HTML, untuk pembuatan tabel menggunakan tag <table> utuk membuat table, <tr> untuk membuat baris dan <td> untuk membuat kolom.
Untuk lebih memahami pembuata table pada HTML berikut saya sajikan penjelasan tag yang terlibat dalam pembuatan table pada HTML.
- <table> merupakan tag pembuka dalam membuat sebuah table pada html, tanpa <table> ini, penggunaan <tr> dan <td> tidak bisa difungsikan dengan baik.
- <tr> atau dikenal dengan table row merupakan tag yang digunakan untuk membuat baris dalam table HTML
- <td> atau dikenal dengan table data merpakan tag yang digunakan untuk membuat kolom dalam baris dan untuk menampilkan data dalam table
- <th> untuk membuat table head atau bagian kepala pada table.
Perhatikan contoh pembuatan table pada HTML berikut :
<!DOCTYPE html>
<html>
<head>
<title>belajar membuat tabel di html</title>
</head>
<body>
<table border="1">
<tr>
<td>baris 1 / kolom 1</td>
<td>baris 1 / kolom 2</td>
<td>baris 1 / kolom 3</td>
</tr>
<tr>
<td>baris 2 / kolom 1</td>
<td>baris 2 / kolom 2</td>
<td>baris 2 / kolom 3</td>
</tr>
<tr>
<td>baris 3/ kolom 1</td>
<td>baris 3/ kolom 2</td>
<td>baris 3/ kolom 3</td>
</tr>
<tr>
<td>baris 4/ kolom 1</td>
<td>baris 4/ kolom 2</td>
<td>baris 4/ kolom 3</td>
</tr>
</table>
</body>
</html>
Dari contoh diatas dapat anda lihat sendiri fungsi dari masing-masing tag yang sudah kita bahas diatas. namun pada tag table saya memberikan atribut border=’1′. atribut border ini digunakan untuk memberika garis tepi pada table dan nilai 1 ini merupakan nilai dari garis tepi pada tabel yang kita buat tadi.
Dan berikut ini adalah contoh membuat tabel HTML dengan menggunakan tag head atau bagian kepala tabel. Contoh :
<!DOCTYPE html>
<html>
<head>
<title>belajar membuat tabel di html</title>
</head>
<body>
<table border="1">
<tr>
<th>No</th>
<th>Nama</th>
<th>Alamat</th>
</tr>
<tr>
<td>1</td>
<td>Badrul</td>
<td>Sumedang</td>
</tr>
<tr>
<td>2</td>
<td>Andi</td>
<td>Jakarta</td>
</tr>
<tr>
<td>3</td>
<td>Budi</td>
<td>Bandung</td>
</tr>
</table>
</body>
</html>
![Cara Membuat Foto Sampul Facebook Keren dan Unik [Tools Online]](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEihTdosiQ6a7NvxVromfDJ7CGnfuEM5gb0mPoe4nvoCQ2iRAOK9wEojx9RjR2woJCKSgi1cTQopksEUj7iXmuLToCpt-Dgu5R54oE8943lTtx1UlGfQmookWzjMuFhkHhI9Efb0aNq9FMXe/s72-c/Timeline_Cover_doNotRename23+(FILEminimizer).png "Cara Membuat Foto Sampul Facebook Keren dan Unik [Tools Online]")
0 comments
Post a Comment