Saturday 14 March 2015

Cara membuat HTML table buat dasar pada desaign website

  bloosoean       Saturday 14 March 2015
Pertemuan kali ini kita akan membuat desaign web dengan cara table HTML Dari materi yang pembuatan HTML tabel dengan langkah desaign yang kita pelajari atau yang sudah kita bahas bersama-sama,
sekarang mari kita belajar bagaimana cara membuat tabel dengan code HTML, nantinya digunakan untuk membuat rancangan awal website seperti gambar dibawah ini.
gambar table liat Antelu
 Dari gambar diatas kita sudah kita masukkan  code maka code HTML Judul seperti dibawah ini :

<table width="800" border="0" cellspacing="5" cellpadding="1">
  <tr>
    <td colspan="3">&nbsp;</td>
  </tr>
  <tr>
    <td colspan="3">&nbsp;</td>
  </tr>
  <tr>
      <td width="230"><table width="229" border="0" cellspacing="5" cellpadding="1">
      <tr>
        <td width="217">&nbsp;</td>
      </tr>
      <tr>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td>&nbsp;</td>
      </tr>
          </table></td>
        <td width="28">&nbsp;</td>
    <td width="516">&nbsp;</td>
  </tr>
</table>

Keterangan dari code diatas tersebut yaitu :

   1.  <table width="800" border="0" cellspacing="5" cellpadding="1"> Digunakan untuk lebar tabelnya 800, border 0 cellspacingnya 5 dan cellpaddingnya 1
   2. <tr> </tr> Digunakan untuk awal dan akhir Baris pada tabel
   3. <td> </td> Digunakan untuk  Kolom pada tabel yang berisi link gambar header tersebut
   4.  colspan="3" digunakan mengabungkan kolom atau merger cell
   5.  nbsp Digunakan untuk tempat tesk atau image
   6. Dari keterangan diatas artinya ada 9 sub table

 Kerjakan Dan dikumpulkan
logoblog

Thanks for reading Cara membuat HTML table buat dasar pada desaign website

Previous
« Prev Post

No comments:

Post a Comment

Terbaru