Selasa, 08 Februari 2011

Kreasi Grafik Batang Berbasis Tabel

0 komentar
MEMBUAT KREASI GRAFIK BATANG STATIS DENGAN MEMANFAATKAN ELEMEN TABEL

Bagaimanapun, fleksibilitas HTML memungkinkan kita untuk menampilkan data di dalam tabel secara atraktif.
Artinya, tak hanya sebatas pada data tabular saja, namun juga mengizinkan kita melakukan penformatan.
 

<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional??EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>
<title>Grafik Berbasis Tabel</title>
</head>

<p>
<h2>Kreasi Grafik Batang Berbasis Tabel</h2>
<p>

<hr align="left" width="700"></hr>
<table width="700" border="0">
<tr>
<th width="400"><b>PERUSAHAAN</b></th>
<td width="400"><b>PENDAPATAN</b></td>
</tr>
</table>
<hr align="left" width="700"></hr>
<table width="700" border="0">

<!-- data pertama -->
<tr>
    <td>Angin Reboot Ltd</td>
    <td width="150" colspan=3></td>
    <td width="150" colspan=2 bgcolor="blue"></td>
    <td width="150">+150%</td>
</tr>

<!-- data kedua -->
<tr>
    <td>Command Prompt, Inc</td>
    <td width="150" colspan=3></td>
    <td width="75" bgcolor="pink"></td>
    <td width="100">+55%</td>
    <td width="150"></td>
</tr>

<!-- data ketiga -->
<tr>
    <td>Hibernate Ltd</td>
    <td width="75"></td>
    <td width="50" align="right">-23%</td>
    <td width="50" bgcolor="red"></td>
    <td width="350" colspan=3></td>
</tr>

<!-- data keempat -->
<tr>
    <td>Shutdown Ltd</td>
    <td width="75" align="right">-75%</td>
    <td width="100" colspan=2 bgcolor="brown"></td>
    <td width="350" colspan=3></td>
</tr>

</table>
<hr align="left" width="700"></hr>
<body background="floral.jpg">
</body>
</html>





Membuat Frame

0 komentar
CONTOH MEMBUAT DESAIN FRAME

Frame memungkinkan kita untuk menampilkan lebih dari satu halaman dokumen dalam satu waktu. Tidak seperti di tabel, tiap-tiap frame mencerminkan halaman yang independen.


<!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/199/xhtml" xml:lang="en" lang="en">

<head>
<title>Studi Kasus</title>
</head>

<frameset rows="20%,*,20%">
<frame src="link2.html" />

<frameset cols="20%,*,20%">

<!-frame kiri -->
<frame src="link1.html" name="left" id="left" />

<!-frame tengah -->
<frame src="linkinternal.html" name="main" id="main" />

<!-frame kanan -->
<frame src="link1.html" name="right" id="right" />

</frameset>
<frame src="link2.html" name="left" id="left"/>
</frameset>

<!-- ini ditampilkan jika browser tidak support frame -->
<noframes>
Browser Tidak Support Frame
</noframes>

</frameset>

</html>