Mari kita belajar Pemrograman web dengan menggunakan pemanfaattan fungsi tabel...
1. Pemanfaatan sebagai grafik batang yang dapat ditunjukkan dari gambar dibawah ini
Adapun code yang didapat dari gambar diatas :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd"><html><head><title>Untitled Document</title><style type="text/css"><!--
.style1 {
font-family: Georgia, "Times New Roman", Times, serif; font-size: 14px; color: #000000;
font-weight: bold; font-style: italic;}
body { background-image: url(Vista_sbliss.jpg);}
.style3 {
color: #FFFF00; font-weight: bold;}
.style5 {color: #FF6600; font-weight: bold;}
.style6 {
color: #FF66CC; font-weight: bold;}
.style7 {
color: #CC0033; font-weight: bold;}
.style8 {
color: #FFFF00; font-style: italic; font-weight: bold;}
.style9 {
color: #FF3300; font-style: italic; font-weight: bold;}
.style10 {
color: #CC33CC; font-style: italic; font-weight: bold;}
.style11 {
color: #CC0033; font-style: italic; font-weight: bold;}
.style12 {color: #FFFFFF}
-->
</style><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"></head><body>
<p class="style1">Tabel yang digunakan dalam pembacaan fungsi Grafik Batang pada suatu Perusahaan</p><hr align="left" width="640">
<table width="634" border="0"> <tr> <td width="321"><strong>Perusahaan</strong></td> <td width="303"><strong>Pendapatan</strong></td> </tr></table><hr align="left" width="640"><table width="643" border="0">
<tr> <td width="151"><span class="style3">Angin Reboot, Ltd </span></td> <td colspan="3"> </td>
<td colspan="2"><table width="150" border="0" bgcolor="#FFFF00">
.... Kelanjuttan File Code Dapat di Download disini
2. Desain tabel perbandingan item dengan memanfaatkan fitur pengelompokan.
Seperti pada gambar
Code Untuk Pembuatannya :
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Bermain Tabel Ke-2</title>
<style type="text/css">
<!--
.style3 {font-family: Geneva, Arial, Helvetica, sans-serif; font-weight: bold; }
.style4 {
font-size: x-large;
color: #FF0000;
}
.style5 {color: #FFFF00}
.style6 {color: #CC0000}
body {
background-image: url(Vista_sbliss.jpg);
}
-->
</style>
</head>
<body>
<table width="470" border="0" align="center" >
<tr>
<td colspan="8" style="border-bottom:#000000 solid;"><div align="center" class="style4">Perbandingan Fitur </div></td>
</tr>
<tr>
<td width="31"align="center"><span class="style3">No</span></td>
<td width="0" rowspan="10" style="border-left:#000000 solid thin;"> </td>
<td width="208" align="center"><span class="style3">Fitur</span></td>
<td rowspan="10" style="border-left:#000000 solid thin;padding-left:-5px;" width="0"> </td>
<td width="92" align="center"><span class="style3">Enterprise</span></td>
<td width="0" rowspan="10" style="border-left:#000000 solid thin;"> </td>
<td width="0"align="center"><span class="style3">Pro</span></td>
<td width="0"align="center"><span class="style3">Free</span></td>
</tr>
... Code selengkapnya dapat diDownload Di Sini
Semoga Bermanfaat...Setelah download jangan lupa kasih Comment ya...Terimakasih
0 comments:
Post a Comment