Cara Membuat Tabel HTML
Tag <table>
adalah salah satu tag yang memiliki atribut terbanyak. Lihat tabel daftar tag
pada bab 1 untuk melihat daftar atributnya. Dalam tag <table> juga
terdapat 2 tag yang penting yang penting yaitu tag <tr></tr> untuk
membuat baris dan tag <td></td> untuk membuat kolom.Tag
<table> adalah tag yang penting dalam pendesainan sebuah tampilan situs.
Jadi anda harus cukup menguasai tag ini.
1. Tabel Border
Border adalah yang akan
mengelilingi data dalam tabel. Dengan menggunakan perintah <Table
Border>.
Tabel border
bisa diatur ketebalannya :
•
Border
0 : digunakan apabila tidak menggunakan border
•
Border
1 : digunakan bila menggunakan nilai border standar
•
Border
2 : digunakan bila ukuran border tebal.
Contoh :
<html>
<body>
<tabel>
<table border>
<tr>
<td> Kolom Pertama
<td> Kolom Kedua
<td> Kolom Ketiga
</tr>
<tr>
<td> SATU
<td> DUA
<td> TIGA
</tr>
</table border>
<tabel>
</body>
</html>
Simpan
dengan nama table01.html
Tampilan
halaman table01.html
2.
Table Header
Perintah
atau komponen yang digunakan Table Header adalah <TH>. Untuk membuat
table header berhubungan erat dengan <tabel border>, <TD>,
<TR> dan <TH>
3. Caption (Judul table)
Prosedure
penulisan Tag<Caption> dan ditutup </Caption> Kalian juga bisa
mengatur penempatan Align disebelah kiri, kanan, atau tengah-tengah. Untuk itu
perlu ditambahkan komponen TAG bernama DIV(division). Cara penulisan <DIV
align=center>Kalimat</DIV>
4. Mengatur Tabel
Align=left untuk
menempatkan table disebelah kiri
Align=right untuk menempatkan
table disebelah kanan
Align=center untuk menempatkan
table ditengah-tengah
Contoh :
<html>
<body>
<caption>
<div align = Center><B>DAFTAR
MAHASISWA AMIK</B></div>
</caption>
<table Border=1 width=75% Align=center>
<TR>
<TH>NO
<TH>NAMA
<TH>FAKULTAS
<TH><div align=right>JURUSAN</div>
<TH>ALAMAT
</TR>
<TR>
<TD>1.
<TD>Pandu Setya Nugraha
<td>MIPA
<td>Ilmu KOmputer
<td>KOmplek LIPI Cibinong
</tr>
<tr>
<td>2.
<td>Terra Surya KIP
<td>FKIP
<td>Biologi
<td>Sukabumi,Jampangkulon
</tr>
</table>
</body>
</html>
Simpan dengan nama table02.html
Tampilan
halaman table02.html
5. Warna
Untuk
mengatur warna dalam suatu dokumen atau program HTML kode yang digunakan
BGCOLOR(Background Color). Penulisan warna bisa menggunakan nilai heksa
desimal, dan biasanya akan menyesuaikan dengan browsernya.
Tabel Warna :
000000 Black
0000FF Blue
A52A2A Brown
00FFFF Cyan
008000 Green
FFA500 Orange
FF00FF Magenta
808080 Gray
FFD700 Gold
ADFF2F Greenyellow
00FFFF Aqua
FAEBD7 Antiquewhite
006400 Darkgreen
Contoh :
<Html>
<body>
<table BGcolor=yellow>
<tr BGcolor=blue>
<td>No<td>Nama <td>Tempat
Lahir <td>Tanggal Lahir <td>Alamat
</tr>
<tr bgcolor=orangea>
<td>1<td>Tuntang
<td>Sukabumi<td>6-6-1962<td>Cibinong
</tr>
<tr bgcolor=red>
<td>2<td>Ganjar
PJ<td>Jampang kulon
<td>1-1-1976<td>Cibinong
</tr>
<tr Bgcolor=cyan>
<td>3<td>Luly <td>Cibadak
<td>1-10-1978<td>Cibadak Sukabumi
</tr>
<tr bgcolor=Magenta>
<td>4<td>Dwi cahyono
<td>Cibaduyut
<td>9-9-1989<td>Jakarta Selatan
</tr>
</body>
</Table>
</html>
Simpan dengan nama table03.html
Tampilan halaman table03.html
Jika Ingin belajar Cara memasukan Gambar Dan Animasi di HTML Silahkan klik Disini
0 Comments