Membuat web sederhana dengan menggunakan Frame [ <frameset> </frameset> ].
Web sederhana yang saya buat ini struktur tampilannya mencotoh dari fanspage A.C. Milan, dan saya buat dengan HTML.
berikut preview dari web sederhana yang saya buat dengan frame :
berikut adalah code HTML dari preview di atas :
<html>
<head>
<title>Satya 12018101</title>
</head>
<frameset rows="160,*,110">
<frame src="header.html" >
<frameset cols="265,*,265">
<frame src="side.html">
<frame src="main.html">
<frame src="side.html">
</frameset>
<frame src="footer.html">
</frameset>
</html>
<head>
<title>Satya 12018101</title>
</head>
<frameset rows="160,*,110">
<frame src="header.html" >
<frameset cols="265,*,265">
<frame src="side.html">
<frame src="main.html">
<frame src="side.html">
</frameset>
<frame src="footer.html">
</frameset>
</html>
berikut adalah code HTML dari frame yang saya masukan ke dalam code di atas ,
header.html :
<html>
<head>
</head>
<body background="bg_milan1000px.jpg" >
<table align="center">
<tr>
<td align="center" colspan="5"><img src="header_milan.png"></td>
</tr>
</table>
</body>
</html>
<head>
</head>
<body background="bg_milan1000px.jpg" >
<table align="center">
<tr>
<td align="center" colspan="5"><img src="header_milan.png"></td>
</tr>
</table>
</body>
</html>
side.html :
<html>
<head>
</head>
<body background="bg_milan1000px.jpg" >
<table align="center">
<tr>
<td><img src="left1.jpg"></td>
</tr>
<tr>
<td><img src="left2.jpg"></td>
</tr>
<tr>
<td><img src="left3.jpg"></td>
</tr>
</table>
</body>
</html>
<head>
</head>
<body background="bg_milan1000px.jpg" >
<table align="center">
<tr>
<td><img src="left1.jpg"></td>
</tr>
<tr>
<td><img src="left2.jpg"></td>
</tr>
<tr>
<td><img src="left3.jpg"></td>
</tr>
</table>
</body>
</html>
main.html :
<html>
<head>
</head>
<body>
<table width="100%" border="1" align="center">
<tr>
<td bgcolor="#D8D8D8" align="center"><a href="http://satyasheva.blogspot.com">News</a></td>
<td bgcolor="#D8D8D8" align="center"><a href="http://satyasheva.blogspot.com">Teams</a></td>
<td bgcolor="#D8D8D8" align="center"><a href="http://satyasheva.blogspot.com">Ticket</a></td>
<td bgcolor="#D8D8D8" align="center"><a href="http://satyasheva.blogspot.com">Shop</a></td>
</tr>
</table>
<h1 align="center">
Satya Budi Tama<br>
12018101<br>
Kelas B<br><br><br><br><br>
</h1>
<h4 align="center"> Visit My Blog !<br>
<a href="http://satyasheva.blogspot.com">satyasheva.blogspot.com</a></h4>
</body>
</html>
<head>
</head>
<body>
<table width="100%" border="1" align="center">
<tr>
<td bgcolor="#D8D8D8" align="center"><a href="http://satyasheva.blogspot.com">News</a></td>
<td bgcolor="#D8D8D8" align="center"><a href="http://satyasheva.blogspot.com">Teams</a></td>
<td bgcolor="#D8D8D8" align="center"><a href="http://satyasheva.blogspot.com">Ticket</a></td>
<td bgcolor="#D8D8D8" align="center"><a href="http://satyasheva.blogspot.com">Shop</a></td>
</tr>
</table>
<h1 align="center">
Satya Budi Tama<br>
12018101<br>
Kelas B<br><br><br><br><br>
</h1>
<h4 align="center"> Visit My Blog !<br>
<a href="http://satyasheva.blogspot.com">satyasheva.blogspot.com</a></h4>
</body>
</html>
footer.html :
<html>
<head>
</head>
<body background="bg_milan1000px.jpg">
<table align="center">
<tr align="center">
<td><img src="foot1.png"></td>
<td><img src="foot2.png"></td>
<td><img src="foot3.png"></td>
<td><img src="foot4.png"></td>
</tr>
</table>
</body>
</html>
<head>
</head>
<body background="bg_milan1000px.jpg">
<table align="center">
<tr align="center">
<td><img src="foot1.png"></td>
<td><img src="foot2.png"></td>
<td><img src="foot3.png"></td>
<td><img src="foot4.png"></td>
</tr>
</table>
</body>
</html>
bg_milan1000px.jpg
header_milan.png
left1.jpg
left2.jpg
left3.jpg
No comments:
Post a Comment