TUGAS-TUGAS KULIAH: Cara Membuat Tabel Sederhana Dengan HTML

Tabel merupakan sebuah kotak yang terdiri atas baris (row) – kolom (Column). Untuk membuat tabel, kita dapat menggunakan perintah tag <table> dan menutupnya dengan tag </table>. Kita juga bisa menambahkan atribut lain di tag <table> pembuka. Misalnya menetukan border, warna dan sebagainya.
Didalam tag <table> ada beberapa tag lain yang perlu kita pahami, yaitu :

Perintah Tag <tr>, artinya tag untuk menuliskan baris biasa di tabel. TR singkatan dari table row.

Perintah Tag <td>, atinya tag untuk menuliskan kotak didalam baris, makanya tag <td> ada di dalam tag <tr>. TR singkatan dari table data.

Perintah Tag <th>, artinya tag untuk menuliskan kotak biasa seperti <td>, namun untuk header tabel. TH singkatan dari table header.

Mengatur Border Border adalah garis yang mengelilingi sebuah tabel.
Contoh:<html> <head><title>Sampul Ilmu</title></head> <body> <BODY><CENTER> <P>Menggunakan tag <b>< TABLE BORDER="1"></b><P> <TABLE BORDER="1"> <TR> <TD>Baris #1 Kolom #1</TD> <TD>Baris #1 Kolom #2</TD> </TR> <TR> <TD>Baris #2 Kolom #1</TD> <TD>Baris #2 Kolom #2</TD> </TR> </TABLE></body></html>
Menggabungkan Kolom
Contoh :
<html> <head><title>Sampul Ilmu</title></head> <BODY> <TABLE BORDER="1" CELLPADDING="1" CELLSPACING="1"> <TR> <TD COLSPAN=2>Kolom A & B</TD>
</TR> <TR> <TD>Kolom C</TD> <TD>Kolom D</TD> </TR> </TABLE></BODY> </html>
Menggabungkan BarisContoh<html> <head><title>Sampul Ilmu</title></head> <BODY> <TABLE BORDER="1" CELLPADDING="1" CELLSPACING="1"> <TR> <TD ROWSPAN="2">Kolom A & C</TD>  <TD>Kolom B</TD> </TR> <TR> <TD>Kolom D</TD> </TR> </TABLE> </BODY> </html>
Perataan Tabel Posisi tabel dapat diatur pertaannya dengan menyertakan atribut ALIGN pada tag <TABLE>
Contoh:<html><body> <TABLE BORDER ALIGN="center"> <TR> <TH>ALIGN="center"</TH> <TD>Kolom #A Tengah</TD> <TD>Kolom #B Tengah</TD> </TR> </TABLE><BR> <TABLE BORDER ALIGN="right"> <TR> <TH>ALIGN="right"</TH> <TD>Kolom #A Kanan</TD> <TD>Kolom #B Kanan</TD> </TR> </TABLE><BR> <TABLE BORDER ALIGN="left"> <TR> <TH>ALIGN="Left"</TH> <TD>Kolom #A Kiri</TD> <TD>Kolom #B Kiri</TD> </TR> </TABLE> </body></html>
Mengatur Isi Sel Teks dalam sel dapat diatur (align) dengan: Rata kiri, rata tengah, dan rata kanan
Atribut yang digunakan adalah :
Align={“left” | “center” | “right”} pada tag <TD>
Atau
Align={“left” | “center” | “right” | “justify”} pada tag <P> dalam tag <TD>
Contoh:<html> <BODY> <TABLE BORDER="1" CELLSPACING="1" WIDTH="100%"> <TR bgcolor="silver"> <td>Text Rata Kiri</td> <td>Text Rata Tengah</td> <td>Text Rata Kanan</td> <td>Text Rata Kiri-Kanan</td> </TR>
</TR> <TR> <TD ALIGN="left" bgcolor="yellow">Kata-kata dalam sel ini rata KIRI</TD> <TD ALIGN="center">Kata-kata dalam sel ini rata TENGAH</TD> <TD ALIGN="right" bgcolor="green"><font color="yellow">Kata-kata dalam sel ini rata KANAN</TD> <TD><p Align="Justify">Kata-kata dalam sel ini rata KIRI-KANAN</TD> </TR> </TABLE> </BODY> </html>

Berikut ini contoh pembuatan tabel sederhana, silahkan dicopy kode di bawah ini :

<html>

<head>

<title>My Biodata | Fia Vauziah Putri</title>

</head>

<h1><marquee behavior="alternate"><blink>..:::Welcome To My Biodata:::..</blink></marquee></h1>

<td width="450px">Fia Vauziah Putri </td>

</tr>

<tr>

<td width="200px">Alamat</td>

<td width="450px">Jl.Letjen H.Ibrahim Adjie Kec.Indihiang Kota Tasikmalaya</td>

</tr>

<tr>