Cara Membuat Tabel pada HTML

A. Pendahuluan :

Tabel (Table) adalah sebuah data dalam bentuk grid yang terdiri dari kolom (column), baris (row) dan cell yang merupakan pertemuan antara kolom dan baris.

Dalam pemformatan tabel, kita membutuhkan beberapa perintah tag. Tag pertama yang kita gunakan adalah tag < table > dan diakhiri dengan tag < / table > dengan disisipkan border digunakan untuk memulai sebuah tabel dengan ketebalan garis tepi tabel (dalam pixel). Tag kedua yang kita gunakan adalah tag < tr > dan diakhiri dengan < / tr > dengan disisipkan bgcolor digunakan untuk membuat baris dari tabel dengan warna background table atau cell. Tag ketiga yang kita gunakan adalah tag < td > dan diakhiri dengan < / td > dengan disipkan bgcolor digunakan untuk menginput data ke tabel dengan warna background table atau cell.


B. Script Code

<!DOCTYPE> <html> <head> <title> Membuat Tabel </title> <h1 style ="text-align:center;"><u> Cara Membuat Tabel pada HTML </u></h1> </head> <body> <H1> Harga Buah </H1> <table border="2" align="center" width="40%"> <tr bgcolor="#b2dfdb"> <th> Harga/Kg </th> </tr> <tr> <td bgcolor="#eeeeee"> Apel </td> <td bgcolor="#eeeeee"> Rp. 8.000,- </td> </tr> <tr> <td bgcolor="#eeeeee"> Jeruk </td> <td bgcolor="#eeeeee"> Rp. 7.500,- </td> </tr> <tr> <td bgcolor="#eeeeee"> Klengkeng </td> <td bgcolor="#eeeeee"> Rp. 10.000,- </td> </tr> <tr> <td bgcolor="#eeeeee"> Anggur </td> <td bgcolor="#eeeeee"> Rp. 12.000,- </td> </tr> </table> </body> </html>

C. Hasil Preview

Harga Buah

border="2" align="center" width="40%">
Harga/Kg
Apel Rp. 8.000,-
Jeruk Rp. 7.500,-
Klengkeng Rp. 10.000,-
Anggur Rp. 12.000,-

D. Kesimpulan :

Dari Script dan hasil di atas dapat diketahui bahwa pada judul dan harga buah tersebut memilki warna sesuai kode yang diinputkan. Berbeda dengan sebelumnya yang belum ditambahkan boder dan bgcolor pada tag tabel tersebut.