Tampilkan postingan dengan label PTI 479 PEMROGAMAN BERBASI WEB. Tampilkan semua postingan
Tampilkan postingan dengan label PTI 479 PEMROGAMAN BERBASI WEB. Tampilkan semua postingan

Rabu, 16 Februari 2011

Pembuatan Grafik Berbasis Tabel Pada HTML

Grafik adalah suatu yang digunakan untuk mempresentasikan hasil pada suatu perusahaan ataupun instansi grafik ada bermacam-macam, kali ini saya akan mencoba untuk membuat grafik berbasi tabel.

 

Gambar diatas adalah contoh grapik berbasi tabel

dan untuk script HTML nya seperti berikut :


<!DOCTYPE html  PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" lang="en">
<head>
<title>Grafik Berbasis tabel</title>
</head>
<body>
<span style="font-family:arial;font-size:130%;color:Blue;">Kreasi Grafik Statis</span>
<table width="561" height="241">
 <tr>
     <td colspan="7" style="border-top:#000000 solid;border-bottom:#000000 solid;"><b>Perusahaan</td>    
        <td colspan="7" style="border-top:#000000 solid;border-bottom:#000000 solid;"><b>Pendapatan</td>  
    </tr>  
    <tr>         
     <td width="172">Angin Reebot Ltd </td>     
        <td width="27"></td>     
        <td width="31"></td>     
        <td width="25"></td>     
        <td width="33"></td>     
        <td width="16"></td>     
        <td width="13"></td>     
        <td colspan="6" bgcolor="#006600"></td>     
        <td width="17">+150%</td>  
    </tr>   
    <tr>     
     <td>Command Prompt, Inc </td>     
        <td></td>     
        <td></td>     
        <td></td>     
        <td></td>     
        <td></td>     
        <td></td>     
        <td colspan="4" bgcolor="#006600"></td>     
        <td width="16">+55%</td>     
        <td width="16"></td>     
        <td></td>   
    </tr>  
    <tr>     
     <td>Hibernate Ltd </td>    
        <td></td>     
        <td></td>     
        <td></td>     
        <td>-23%</td>     
        <td colspan="2" bgcolor="#FFFF00"></td>     
        <td width="34"></td>     
        <td width="16"></td>     
        <td width="16"></td>     
        <td width="16"></td>     
        <td></td>     
        <td></td>    
        <td></td>   
     </tr>   
     <tr>     
      <td>Shutdown Ltd </td>     
        <td></td>     
        <td>-75%</td>     
        <td colspan="4" bgcolor="#FF0000"></td>     
        <td></td>     
        <td></td>     
        <td></td>     
        <td></td>     
        <td></td>    
        <td></td>     
        <td></td>   
     </tr>   
     <tr>     
      <td colspan="14" style="border-top:#000000 solid"></td>   
     </tr> </table>  
</body> 
</html> 


Selamat mencoba membuat. peace!!

Membuat Frame Bertumpuk (Nested Frames)

Kegunaan frame biasanya digunakan untuk membuat suatu halaman yang interaktif di dalam dokumen HTML. Dengan frame kita dapat menampilkan lebih dari satu halaman web dalam halaman browser yang sama. Setiap dokumen HTML dapat ditampilkan di dalam frame dan setiap frame adalah bebas antara satu dengan yang lain.

Gambar diatas adalah contoh dari frameset yang didalamnya terdapat gambar.

 berikut ini adalah scriptnya

<html>
<head><title>frameset</title>
</head>
<frameset rows="20%,60%,20%" >
 <frame src="aaaa.html">
    <frameset cols="30%,50%,20%">
     <frame src="bbbbbbb.html">
     <frame src="aaaa.html">
     <frame src="cccccccccccc.html">
     </frameset>
<frame src="cccccccccccc.html">
</frameset><noframes></noframes>
</html>


Silakan mencoba..........!!