Belajar HTML Part 4 : 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.

  1. <table> merupakan tag pembuka dalam membuat sebuah table pada html, tanpa <table> ini, penggunaan <tr> dan <td> tidak bisa difungsikan dengan baik.
  2. <tr> atau dikenal dengan table row merupakan tag yang digunakan untuk membuat baris dalam table HTML
  3. <td> atau dikenal dengan table data merpakan tag yang digunakan untuk membuat kolom dalam baris dan untuk menampilkan data dalam table
  4. <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>
Membuat Tabel Pada 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>

untuk membuat tampilan tabel yang lebih menarik saya sarankan anda untuk belajar CSS dasar di www.siapngoding.my.id (bisa dilihat disini).

Tutorial HTML Dasar Lainnya

Belajar HTML Part 1 : Pengenalan HTML

Belajar HTML Part 2 : Format Text Pada HTML

Belajar HTML Part 3 : Membuat Paragraf Pada HTML

Belajar HTML Part 4 : Membuat Table Pada HTML

Belajar HTML Part 5 : Membuat Hyperlink Pada HTML

Belajar HTML Part 6 : Membuat List Pada HTML

Belajar HTML Part 7 : Membuat Format Code Pada HTML

Belajar HTML Part 8 : Membuat Form Pada HTML

Belajar HTML Part 9 : Atribut Form Pada HTML

Belajar HTML Part 10 : Membuat Symbol Pada HTML

Belajar HTML Part 11 :Menampilkan Gambar Pada HTML

Belajar HTML Part 12 : Tag Iframe Pada HTML

Belajar HTML Part 13 : Menghubungkan HTML dengan CSS

Belajar HTML Part 14 : Mengenal Class dan Id Pada HTML

Incoming Search Terms:
  • cara membuat tabel di html
  • cara membuat tabel dalam tabel di html
  • cara membuat tabel didalam tabel pada html
  • cara membuat tabel html
  • membuat tabel dengan html
  • membuat tabel didalam tabel html
  • cara membuat tabel pada html
  • cara membuat tabel dengan html