LAYOUT
LATIHAN 1
<html>
<head>
<title>Layout Dengan Tabel Index</title>
</head>
<body>
<font face="arial" size=3>
<table width=1010 align=center>
<tr>
<td width="240" bgcolor="#FF9900"><font size="3"
face="arial"><strong>Logo Usaha
</strong></font></td>
<td width="758" align=right valign=bottom>
<table bgcolor="FFAA00"
<tr>
<td><strong>Button Home</strong></td>
<td><strong><font size="3" face="arial">Button
Profil </font></strong></td>
<td><strong><font size="3" face="arial">Button
Produk </font></strong></td>
<td><strong><font size="3" face="arial">Button
Kontak </font></strong></td>
</tr>
</table>
</td></tr>
</table>
<table rules=group frame=box align=center>
<thead>
<tr><th bgcolor="#FF7700"colspan=3><p> </p>
<p>Gambar Header</p>
<p> </p></th>
</tr>
</thead>
<tbody>
<tr><th height=30 width=1000 bgcolor="#FF7700"
colspan=3><marquee behavior=alternate
scrollamount=3>
<b><font size="3" face="arial"> Ucapan Selamat Datang Marque </font></b>
</marquee></th></tr>
</tbody>
<tbody>
<tr>
<td valign=top align=center bgcolor="#FFAA00"
width=200>
<table>
<tr><td align=center><br><img src="_20160526_130727.jpg" witdh=250 height =250></td></tr>
<tr><td align=center><br>
<strong>Foto Saya </strong><br></td></tr>
<tr><td align=center><br><p><hr width=200
color="#FF7700">
Adalah Mahasiswa <font size="3" face="arial">AMIK
PARBINUS</font> yang mencoba untuk belajar
selagi masih sempat untuk belajar
<hr width=200 color="#FF7700"></p><br></td></tr>
<tr><td align=center><img src="Foto olvhy sherait1.jpg" witdh=250 height =250></td></tr>
<tr><td align=center>
<table>
<tr><td>Username</td><td><input type=text
size=15></td></tr>
<tr><td>Password</td><td><input type=text
size=15></td></tr>
<tr><td colspan=2><b>Lupa Password?</b></td></tr>
<tr><td colspan=2><a href ="index.html"><input
type=submit value=kirim></a><a
href="index.html"><input type=reset
value=batal></a></td></tr>
</table>
</td></tr>
</table>
</td>
<td valign=top align=center bgcolor="#FFAA00"
width=200>
<table>
<tr><td align=center><br><img
src="header1.png" witdh=200 height =100></td></tr>
<tr>
<td align=center><p><font size="3"
face="arial"><strong>Logo Usaha</strong></font></p>
<hr color="#FF7700"></td></tr>
<tr><td><b>INFO PRODUK TERBARU HARI
INI</b></td></tr>
<tr><td>Berikut daftar produk Terlaku hari ini
:</td></tr>
<tr><td>
<table width=500><tr><td>
<ul>
<li>Colpad</li>
<li>Mouse Variasi</li>
<li>Joystik</li>
</ul>
</td><td align=right><img src="coolpad.jpg"width=80
height=70></td><td align=right><img src="Joystik.jpg"width=80
height=70></td><td align=right></td></tr></table>
</td></tr>
<tr><td><b>INFO PRODUK DISKON 50%</b></td></tr>
<tr><td>Berikut daftar produk yang di diskon
:</td></tr>
<tr><td>
<table width=500><tr><td>
<ul>
<li>Flashdisk 4GB</li>
<li>Speaker Mini</li>
<li>Coling Pad</li>
</ul>
</td><td align=right><img src="flashdisk.png" width=80
height=70></td><td align=right><img src="speaker.png" width=80
height=70></td></tr></table>
</td></tr>
<tr><td><hr color="#FF7700"><b>INFO PRODUK KOMPUTER
DAN LAPTOP</b></td></tr>
<tr><td>Berikut daftar produk Komputer dan Laptop
:</td></tr>
<tr><td>
<table>
<tr>
<td><img src="komputer1.png" width=120
height=100></td>
<td><img src="komputer2.png" width=120 height=100></td>
<td><img src="1.png" width=120 height=100></td>
<td><img src="2.png" width=120
height=100></td>
</tr>
</table>
</td></tr>
</table>
</td>
<td valign=top align=center bgcolor="#FFAA00"
width=200>
<table align=center>
<tr><td align=center><br><img
src="22.png" witdh=60 height=60><br></td></tr>
<tr><td align=center>
<table align=center>
<tr><td><img src="asus.png" width=60
height=60><hr color="#FF7700"></td><td>Seperangkat
Komputer Desktop></td></tr>
<tr><td><img src="komputer2.png" width=60
height=60><hr color="#FF7700"></td><td>Notebook Terbaru Asus
1215B></td></tr>
</table>
</td></tr>
<tr><td align=center><img src="coolpad.jpg" witdh=60 height=60></td></tr>
<tr>
<td align=center>
<marquee direction="down" scrollamount=3>
<table align=center>
<tr>
<td align=center>
<hr color="FF7700" width=200>
Baru kemaren mesan hari ini sudah sampai gan di
temapet ane,rekomended deh pelayanannya,thanks gan
admin
</td>
</tr>
<tr>
<td align=center>
<hr color="#FF7700" width=200>
Harganya murah meriah,ane kemaren beli langsung
banyak,buat toko ane di Banjarmasin
</td>
</tr>
<tr>
<td align=center>
<hr color="#FF7700" width=200>
Wah,gua juga mau nih gan,kira kira ke Jogja
brapa ya ongkirnya?<hr color="#FF7700" width=200>
</td>
</tr>
</table>
</marqueee>
</td>
</tr>
<tr><td><b>Mau Kirim Pesan ?</b></td></tr>
<tr><td><a href="kontak.html"><input type=submit
value="klik disini"></a></td></tr>
<tr><td>
<table>
<tr>
<td><img src="1.png"width=50 height=50></td>
<td><img src="komputer1.png"width=50 height=50></td>
<td><img src="komputer2.png"width=50 height=50></td>
<td><img src="17.png"width=50 height=50></td>
</tr>
</table>
</td></tr>
</table>
</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan=3 align=center bg color ="#FF7700"
height=50><b><font size="3"
face="arial"><Footer</font></b></td>
</tr>
</tfoot>
</table>
<br><br>
</font>
</body>
</html>
OUTPUTNYA:
LATIHAN 2
<td valign=top align=center bgcolor="#FFCC00"
width=500>
<table align=center width=470>
<tr><td align=center><br><img src="22.png"
width="350" height="300"><br></td></tr>
<tr><td><b><br>FORM KOMENTAR,PESAN,DAN SARAN</b></td></tr>
<tr><td><hr color="#FF7700">
<table>
<tr><td width=150><b>Nama Lengkap</b></td><td> :
</td><td><input type=text size=45></td></tr>
<tr><td width=150><b>Alamat Web</b></td><td> :
</td><td><input type=text size=45></td></tr>
<tr><td width=150><b>E-mail</b></td><td> :
</td><td><input type=text size=45></td></tr>
<tr><td width=150><b>Password</b></td><td> :
</td><td><input type=password size=45></td></tr>
<tr><td width=150 valign=top><b>Jenis
Kontak</b></td><td> : </td><td><input type=radio
name=kontak>Pesan<br><input type=radio
name=kontak>Kritik<br><input type=radio
name=kontak>Saran<br><input type=radio
name=kontak>Komentar</td></tr>
<tr><td width=150><b>Tanggal Lahir</b></td><td> :
</td><td><select>
<option>--Tanggal--</option>
<option>1</option><option>2</option><option>3</option>
<option>4</option><option>5</option><option>6</option>
<option>7</option><option>8</option><option>9</option><option>10</option>
<option>11</option><option>12</option><option>13</option><option>14</option><option>15</option>
<option>16</option><option>17</option><option>18</option><option>19</option>
<option>20</option><option>21</option><option>22</option><option>23</option><option>24</option>
<option>25</option><option>26</option><option>27
</option><option>28</option><option>29</option><option>30</option><option>31</option>
</select>
<select>
<option>--Bulan--</option>
<option>Jan</option><option>Feb</option><option>Maret</option><option>Apr</option><option>Mei</option>
<option>Juni</option><option>Juli</option><option>Agst</option><option>Sep</option><option>Okt</option>
<option>Nov</option><option>Des</option>
</select>
<select>
<option>--Tahun--</option>
<option>1991</option><option>1992</option><option>1993</option><option>1994</option>
<option>1995</option><option>1996</option><option>1997</option><option>1998</option><option>1999</option><option>2000</option>
<option>2001</option><option>2002</option><option>2003</option><option>2004</option>
<option>2005</option><option>2006</option><option>2007</option><option>2008</option><option>2009</option><option>2010</option>
<option>2011</option>
</select>
</td></tr>
<tr><td width=150 valign=top><b>Hobby</b></td><td>
: </td><td><input type=checkbox>Olahraga<br>input
type=checkbox>Baca Buku<br><input
type=checkbox>Organisasi<br><input
type=checkbox>Lainnya</td></tr>
<tr><td width=150 valign=top><b>Pesan</b></td><td>
: </td><td><textcare cols=33 rows=3></textcare><hr
color="#FF7700"</td></tr>
<tr><td colspan=2 valign=top><a
href="thanks.html"><input type=submit
value=kirim></a><a href="index.html"><input
type=reset value=batal></a></td>
<td><font size="3" face="arial>Logo Perusahaan
</font></td>
</tr>
</table>
</td></tr>
</table>
</td>
OUTPUTNYA:
LATIHAN 3
<td valign=top align=center bgcolor="#FFCC00"
width=500>
<table align=center width=470>
<tr><td align=center><br><img src="seperangkat.png"><br></td></tr>
<tr><td align=center><b><br>DAFTAR LIST KOMPUTER
DAN LAPTOP</b></td></tr>
<tr><td><hr color="#FF7700">
<table>
<tr>
<td><img src="komputer2.png" width=150
height=150></td>
<td><img src="asus.png" width=150
height=150></td>
<td><img src="1.png" width=150
height=150></td></tr>
<tr align=center><td>CPU dan SOUND</td><td>Notebook
Mini</td><td>ASUS seri game</td></tr>
<tr align=center><td><b>Rp.3000.000,-
</b></td><td><b>Rp.2.500.000,-
</b></td><td><b>Rp.7.000.000,-</b></td></tr>
<tr><td colspan=3><hr color="#FF7700"></td></tr>
</table>
</td></tr>
<tr><td>
<table>
<tr>
<td><img src="download.jpg" width=150
height=150></td>
<td><img src="22.png" width=150
height=150></td>
<td><img src="17.png"width=150
height=150></td></tr>
<tr align=center><td>Deskbok Axioo</td><td>Seperangkat PC</td><td>ASUS Multimedia</td></tr>
<tr align=center><td>CPU dan SOUND</td><td>Notebook
Mini</td><td>ASUS seri game</td></tr>
<tr align=center><td><b>Rp.3000.000,-
</b></td><td><b>Rp.2.500.000,-
</b></td><td><b>Rp.7.000.000,-</b></td></tr>
<tr><td colspan=3><hr color="#FF7700"></td></tr>
</table>
</td></tr>
</table>
</td>
OUTPUTNYA:
LATIHAN 4
q<html>
<head>
<title>Layout dengan Table Index</title>
</head>
<body>
<font face="arial" size=3>
<table width=1010 align=center>
<tr>
<td width="240" bgcolor="#FF9900"><font size="3"
face="arial"><strong><Logo Usaha</strong></font></td>
<td width="758" align=right valign=bottom>
<table bgcolor="#FFAA00">
<tr>
<td><strong>Buttom Home</strong></td>
<td><strong><font size="3" face="arial">Buttom Profil</font></strong></td>
<td><strong><font size="3" face="arial">Buttom Produk</font></strong></td>
<td><strong><font size="3" face="arial">Buttom Kontak</font></strong></td>
</tr>
</table>
</td></tr>
</table>
<table rules=group frame=box align=center>
<thead>
<tr><th bgcolor="#FF7700" colspan=3><p> </p>
<p>Gambar Header</p>
<p> </p></th>
</tr>
</thead>
<tbody>
<tr><th height=30 widht=1000 bgcolor="#FF7700"
colspan=3><marquee behavior=alternate
scrollamount=>
<b><font size="3" face="arial"> Ucapan Selamat
Datang Marque</font></b>
</marquee></th></tr>
</body>
<tbody>
<tr>
<td valign=top align=center bgcolor="#FFAA00"
width=200>
<table>
<tr><td align=center><br><img src="1465904496745.jpg" width=150 height=150></td></tr>
<tr><td align=center><br>
<strong> </strong><br></td></tr>
<tr><td align=center><br><p><hr width=200
color="#FF7700">
Adalah Mahasiswa <font size="3" face="arial"> AMIK
Parbina Nusantara</font>yang mencoba untuk belajar selagi masih sempat untuk belajar
<hr width=200 color="FF7700"></p><br></td></tr>
<tr><td align=center><img src="P_20161028_073200_1_BF_p.jpg"width=150 height=150></td></tr>
<tr><td align=center>
<table>
<tr><td>Username</td><td><input type=text
size=15></td></tr>
<tr><td>Password</td><td><input type=text
size=15></td></tr>
<tr><td colspan=2><b>Lupa Password?</b></td></tr>
<tr><td colspan=2><a href ="thanks.html"><input
type=submit value=kirim></a><a
href="index.html">input type=reset
value=batal></a></td></tr>
</table>
</td></tr>
</table>
</td>
<td valign=top align=center bgcolor="#FFCC00"
width="500">
<table align=center width="470">
<tr><td align=center><br><img src="header1.png"><br></td></tr>
<tr><td><b><br>PROFILE
CAHAYA ILMU KOMPUTER.COM</b></td></tr>
<tr><td>Cahaya ilmu komputer merupakan toko
penjualan alat-alat komputer maupun laptop dan juga
menjual segala aksesoris komputer dan laptop</td></tr>
<tr><td><b><br>SEJARAH
CAHAYA ILMU KOMPUTER.COM</b></td></tr>
<tr><td>Cahay ilmu komputer didirikan pada tanggal
20 Mei 2009 lalu,hingga saat ini masih beroperasi
dan melayani masyarakat dalam penjualan alat-alat
komputer dan selalu berusaha mengikuti perkembangan
zaman</td></tr>
<tr><td><b><br>BIDANG
CAHAYA ILMU KOMPUTER.COM</b></td></tr>
<td><tr>Cahaya Ilmu Komputer melayani penjualan,
service alat-alat komputer dan perbaikan printer
berbagia jenis yang merupakan keunggulan dari
semuanya adalah jasa pembuatan website</td></tr>
<tr><td><b><br>LOGO
CAHAYA ILMU KOMPUTER.COM</b></td></tr>
<td><tr>Logo cahaya ilmu komputer adalah sebagai
berikut:</td></tr>
<tr><td><img src="logoo.png" width=350
height=100></td></tr>
</table>
</td>
<td valign=top align=center bgcolor="#FFAA00"
width=200>
<table align=center>
<tr><td align=center><br><img
src="1.png"<br></td></tr>
<tr><td align=center>
<table align=center>
<tr><td><img src="2.png" width=60
height=60><hr color="#FF7700"></td><td>Seperangkat
Komputer Desktop></td></tr>
<tr><td><img src="asus.jpg" width=60
height=60><hr color="#FF7700"></td><td>Notebook Terbaru Asus
1215B></td></tr>
</table>
</td></
<tr><td align=center><img src="komputer1.png" width=60
height=60></td></tr>
<tr>
<td align=center>
<marquee direction="down" scrollamount=3>
<table align=center>
<tr>
<td align=center>
<hr color="FF7700" width=200>
Baru kemaren mesan hari ini sudah sampai gan di
temapet ane,rekomended deh pelayanannya,thanks gan
admin
</td>
</tr>
<tr>
<td align=center>
<hr color="#FF7700" width=200>
Harganya murah meriah,ane kemaren beli langsung
banyak,buat toko ane di Banjarmasin
</td>
</tr>
<tr>
<td align=center>
<hr color="#FF7700" width=200>
Wah,gua juga mau nih gan,kira kira ke Jogja
brapa ya ongkirnya?<hr color="#FF7700" width=200>
</td>
</tr>
</table>
</marqueee>
</td>
</tr>
<tr><td><b>Mau Kirim Pesan ?</b></td></tr>
<tr><td><a href="kontak.html"><input type=submit
value="klik disini"></a></td></tr>
<tr><td>
<table>
<tr>
<td><img src="speaker.png" width=50 height=50></td>
<td><img src="2.png" width=50 height=50></td>
<td><img src="komputer2.png" width=50 height=50></td>
<td><img src="download.jpg" width=50 height=50></td>
</tr>
</table>
</td></tr>
</table>
</td>
</tr>
</tbody>
<tfoot>
<tr>
<td colspan=3 align=center bg color ="#FF7700"
height=50><b><font size="3"
face="arial"><Footer</font></b></td>
</tr>
</tfoot>
</table>
<br><br>
</font>
</body>
</html>
OUTPUTNYA:
SEKIAN BAB 6 DARI SAYA SEMOGA BERMANFAAT YAH
THANK'S :)
Tidak ada komentar:
Posting Komentar