Jumat, 26 Mei 2017
Untuk membuat frame kita harus membuat beberapa file html, pada postingan ini saya membuat 5 file html berikut penjelasannya .
- File pertama untuk bagian atas pada tampilan frame.
simpan dengan top.html
<html>
<head>
<title>...</title>
</head>
<body bgcolor=#8c6635>
<b><font size="4"> Top Navigasi</b></font></p>
<a href="left.html" target="_blank"> <u>Menu 1 </u></a> |
<a href="right.html" target="_blank"><u>Menu 2</u></a>
</body>
</html>
Berikut tampilannya:
- File kedua untuk bagian sebelah kiri pada tampilan frame.
Simpan dengan Left.html
<html>
<head>
<title>...</title>
</head>
<body bgcolor=#ef9c00>
<b><font size="4"> Menu 1</b></font></p>
<a href="page 1.html" target="_blank"><u>Laman Putih </u></a></p>
<b>Contoh Lain</b></p>
<a href="http://www.facebook.com" target="_blank"><u>Contoh 1</u></a><br>
<a href="http://www.youtube.com" target="_blank"><u>Contoh 2</u></a><br>
<a href="http://www.irsyadkeling.blogspot.com" target="_blank"><u>Contoh 3</u></a><br>
<a href="http://www.gmail.com" target="_blank"><u>Contoh 4</u></a><br>
<a href="http://www.yahoo.com" target="_blank"><u>Contoh 5</u></a><br>
</body>
</html>
Berikut tampilannya:
- File ketiga untuk bagian tengah pada tampilan frame
simpan dengan Center.html
<html>
<head>
<title>...</title>
</head>
<body bgcolor=#e6e200>
<b><font size="6" face="calibri">Content</b></font></p>
<b><font size="5" face="calibri">Replacing the Contents of the Currents Frame</b></font></p>
Clicking on These links will open the new page within the current frame.</p>
<ul type="square">
<li><a href="Page 1.html" target="_blank">Menuju white page</a></li>
<li><a href="Page 2.html" target="_blank">Menuju green page</a></li></p>
</ul>
<b><font size="5" face="calibri">Replacing the Contents of the Currents Frame</b></font></p>
When you click on any of the following links, the whole frameset is relplaced with the new website.
This is because we're using in the anchor links.</p>
<ul type="square">
<li><a href="http://www.pelitanusantara.ac.id" target="_blank"><u>Pelita Nusantara</u></a></li>
<li><a href="right.html" target=_blank"><u>HTML Frames Templates</a></u></li>
<li>Learn more about frames with the <a href="left.html" target=_blank""><u>HTML Frames Templates</a></u></li></p>
</ul>
<b><font size="5" face="calibri">Open a New Windows</b></font></p>
These links open in a new browser window. This is because we use <font face="Courier New">target "_blank".</font></p>
<ul type="square">
<li><a href="http://www.pelitanusantara.ac.id" target="_blank"><u>Pelita Nusantara</u></a></li>
<li><a href="right.html" target=_blank"><u>HTML Frames Templates</a></u></li>
<li> Learn more about frames with the <a href="left.html" target=_blank"><u>HTML Frames Templates</a></u></li><br>
</ul>
</body>
</html>
Berikut tampilannya:
-File keempat untuk bagian kanan pada tampilan frame
simpan dengan Right.html
<html>
<head>
<title>...</title>
</head>
<body bgcolor=#766454>
<b><font color="white">Relasi</b></font></p>
<a href="http://www.pelitanusantara.ac.id" target="_blank"><font color="white"><u>Penusa</u></a></font><br>
<a href="http://www.pelitanusantara.ac.id" target="_blank"><font color="white"><u>Penusa</u></a></font><br>
<a href="http://www.pelitanusantara.ac.id" target="_blank"><font color="white"><u>Penusa</u></a></font><br>
<a href="http://www.pelitanusantara.ac.id" target="_blank"><font color="white"><u>Penusa</u></a></font><br>
</body>
</html>
Berikut tampilannya:
- File yang kelima untuk bagian bawah pada tampilan frame
simpan dengan buttom.html
<html>
<head>
<title>...</title>
</head>
<body bgcolor="black">
<b><font color="white" size="4"> Footer</b></font></p>
<a href="page 1.html" target="_blank"><font color="white"><u>White Page </u></a> |
<a href="page 2.html" target="_blank"><font color="white"><u>Green Page</u></a></font>
</body>
</html>
Untuk membuat frame dari kelima file html yang telah di buat.
Simpan dengan Frame.html
<html>
<frameset rows="14%,75%,11%">
<frame src="top.html">
<frameset cols="15%,70%,15%">
<frame src="Left.html">
<frame src="Center.html">
<frame src="Right.html">
</frameset>
<frame src="buttom.html">
</frameset>
</html>
Berikut tampilannya: