Latihan 1 - Aplikasi Pemrograman Web - Layout dengan Tabel

Latihan 1 - Aplikasi Pemrograman Web

Dalam praktik pembuatan aplikasi pemrograman web ini dapat dilihat pada video berikut :

Video Aplikasi Buku Perpustakaan

- - - - -

Tahap Awal pembuatan aplikasi.

Membuat Aplikasi Permograman Web dengan Layout Tabel.

Ketiklah program HTML berikut ini :

Contoh 1 :

<table border="1" width="800" align="center">

   <tr height="50" bgcolor="blue">

     <td>

       <font color="white"><b>

       <a href="#">Home</a> | 

       <a href="#">Tambah Buku</a> | 

       <a href="#">Lihat Buku</a> | 

       <a href="#">About Me</a>

       </font></b>

     </td>

   </tr>

   <tr height="200" bgcolor="yellow">

     <td>

       <img src="">

     </td>

   </tr>

   <tr height="50" bgcolor="yellow">

     <td>

       <marquee>selamat datang

       </marquee>

     </td>

   </tr>

   <tr height="800" bgcolor="lightblue">

     <td>isi

     </td>

   </tr>

   <tr height="200" bgcolor="brown">

     <td align="center">

       <font color="white"><b>

         Aplikasi Buku Perpustakaan<br>

         created by nama dan kelas<br>

         @2020

       </font></b>

     </td>

   </tr>

</table>

- - - - -

Contoh 2 :

<table border="1" width="800" align="center">
   <tr height="200" bgcolor="green">
     <td colspan="2">
       <img src="">
     </td>
   </tr>
   <tr height="50" bgcolor="yellow">
     <td colspan="2">
       <marquee>selamat datang
       </marquee>
     </td>
   </tr>
   <tr height="800">
     <td width="200" valign="top" bgcolor="lightblue">
       <font color="white"><b>
       <a href="#">Home</a> | <br>
       <a href="#">Tambah Buku</a> | <br>
       <a href="#">Lihat Buku</a> | <br>
       <a href="#">About Me</a>
       </font></b>
     </td>
   <td valign="top" bgcolor="blue">isi
   </td>
   </tr>
   <tr height="200" bgcolor="brown">
     <td align="center" colspan="2">
       <font color="white"><b>
         Aplikasi Buku Perpustakaan<br>
         created by nama dan kelas<br>
         @2020
       </font></b>
     </td>
   </tr>

</table>

 

 

 

 

- - - -
Quiz

 

Kerjakanlah quiz di bawah ini :

 

 

 

 

 

 

- - - - -

sumber :

* internet

 

 

 

x

Share: