HTML Dasar Part 5 Table

HTML Dasar Part 5 Table

TABLE
sekarang kita akan belajar tentang membuat TABLE
Berikut tag2 yang dipergunakan untuk membentuk suatu tabel :

<TABLE></TABLE> – adalah tag awal, penanda awal dan akhir suatu tabel.

<TR></TR> – adalah tag yang menandakan suatu baris dalam tabel

<TD></TD> – adalah tag yang akan membagi baris menjadi beberapa kolom.
Masing-masing tag memiliki atribut sebagai berikut :
bgcolor - atribut untuk menentukan warna latar belakang

background - atribut untuk menentukan gambar yang akan menjadi latar belakang tabel / kolom

width – atribut untuk menentukan lebar

height – atribut untuk menentukan tinggi

align - mengatur perataan horizontal

valign – mengatur perataan vertikal

border - atribut untuk menentukan lebar bingkai tabel

cellspacing – atribut untuk menentukan jarak antar kolom

cellpadding – atribut untuk menentukan jarak antara isi dengan tepi kolom

colspan – menentukan berapa kolom yang akan digabung

rowspan – menentukan berapa baris yang akan digabung

Dan sekarang, mari kita coba mempraktekkannya

Contoh 1:


<BODY>

<TABLE WIDTH="80%" BORDER="1">

    <TR>

         <TD>Ini kolom pertama</TD>

         <TD>Ini kolom kedua</TD>

   </TR>
   <TR>
         <TD>Ini kolom pertama baris kedua</TD>
          <TD>Ini kolom kedua baris kedua</TD>
   </TR>

</TABLE>

</BODY>

gmn hasilnya????

contoh 2:

<table border=2 cellpading=5 cellspacing=5 >
<caption><b> Pengolahan Tabel </b></caption>
<tr>
    <Td bgcolor="cyan" rowspan=3 align="center">Kolom 1 </td>
     <td bgcolor="yellow"> kolom 2 </td>
 </tr>

<tr>
    <td bgcolor="green" > kolom 1 baris 2 </td>
    <td bgcolor="red"> kolom 2 baris 2 </td>

</tr>
<tr>
    <td bgcolor="cyan"> kolom 1 baris 3 </td>
    <td bgcolor="yellow"> kolom 2 baris 3 </td>

</tr>
<tr>

   <td bgcolor="green"> kolom 1 baris 4 </td>

   <td bgcolor="red"> kolom 2 baris 4 </td>

</tr>
<tr>

    <td bgcolor="cyan"colspan=2 align="center"> kolom 1 baris 5 </td>
    <td bgcolor="yellow"> kolom 2 baris 5 </td>

</tr>

</table>


dan Contoh terakhir...

<table border=5 bordercolor="green" width=700>
<tr>
 <td colspan=6 align="center"><marquee direction="left" bgcolor="red"> <b>DAFTARMAHASISWA</b></marquee></td>

</tr>
<tr>

<td rowspan=2 align="center" colspan=2 bgcolor="00ff00"><marquee behavior="alternate" direction="right"><b> KamPuZ khAyalAN</b></marquee></td>

<td colspan=5 align="center" bgcolor="teal"><marquee behavior="alternate" direction="left"><b> Jurusan</b></marquee></td>

</tr>

<tr>
<td align="center" bgcolor="yellow"> MI </td>

<td align="center" bgcolor="yellow"> TI </td>

<td align="center" bgcolor="yellow"> SI </td>

<td align="center" bgcolor="yellow"> AK </td>

</tr>

<tr>

<td rowspan=2 align="center" bgcolor="orange"><font color="blue"><b> Jenis kelamin</b></font></td>

<td align="center" bgcolor="cream"> Pria </td>

<td align="center" bgcolor="blue"> 12 </td>

<td align="center" bgcolor="blue"> 20 </td>

<td align="center" bgcolor="blue"> 15 </td>

<td align="center" bgcolor="blue"> 22 </td>

</tr>

<tr>

<td align="center" bgcolor="pink"> Wanita</td>

<td align="center" bgcolor=" green tea"> 11</td>

<td align="center" bgcolor=" green tea"> 15</td>

<td align="center" bgcolor=" green tea"> 20</td>

<td align="center" bgcolor=" green tea"> 10</td>

</tr>

</table>

Apakah contoh yang terkhir hasilnya seperti ini??

DAFTAR MAHASISWA
KamPuZ khAyalAN Jurusan
MI TI SI AK
Jenis kelamin Pria 12 20 15 22
Wanita 11 15 20 10

SEMOGA BERHASIL......

About

This is dummy text. It is not meant to be read. Accordingly, it is difficult to figure out when to end it. But then, this is dummy text. It is not meant to be read. Period.

# Silahkan Anda Berkomentar dengan Baik dan Sopan
# Pesan dilarang Mengandung SARA dan Spam
# Terima Kasih Telah berkunjung di Blog Sederhana ini ConversionConversion EmoticonEmoticon

:)
:(
=(
^_^
:D
=D
=)D
|o|
@@,
;)
:-bd
:-d
:p
:ng
:lv
Thanks for your comment
Langganan: Posting Komentar (Atom)