Creation of website with Frames and CSS
Frame File
<html>
<head>
<title>index</title>
</head>
<frameset rows=30%,45%,*>
<frame name="f1" src="top.htm">
<frameset cols=30%,70%>
<frame name="f2" src="left.htm">
<frame name="f3" src="right1.htm">
</frameset>
<frame name="f4" src="bottom.htm">
</frameset>
</html>
<html>
<head>
<title>this is a top page</title>
<style type="text/css">
<!--
body{background-color:"pink";};
h1{font-family:monotype corsiva;color:brown;width:300;;position:absolute;left:400px};
b{font-family:monotype corsiva;color:"black";};
-->
</style>
</head>
<body>
<h1>Welcome to the top page</h1>
<br>
<b>this is a top page</b>
</body>
</html>
<html>
Top file
<head>
<title>this is a left page</title>
<style type="text/css">
<!--
h1{font-family:monotype corsiva, font-style;bold;color:brown;};
b{font-family:monotype corsiva, font-style;italic;color:red;background-color:gray;}
-->
</style>
</head>
<body bgcolor="pink" style="float: right">
<h1>Welcome</h1>
<b>this is a left page</b>
<p><p><p>
<a href=right1.htm target=f3> Right1 page</a><br>
<a href=right2.htm target=f3>Right2 page</a><br>
<a href=right3.htm target=f3>Right3 page</a><br>
</body>
</html>
Right1.html
<html>
<head>
<title>this is a right1 page</title>
<style type="text/css">
<!--
body{ background:"orange";};
h1{font-family:monotype corsiva, font-style;bold;color:brown;position:absolute;left:400;top:100;};
p{font-family:monotype corsiva;color:red;position:relative;top:115;
font-size:19pt;}
-->
</style>
</head>
<body>
<h1> this is a right1 page</h1>
<p>this is a right1 page</p>
</body>
</html>
Right1.html
<html>
<head>
<title>this is a right2 page</title>
<style type="text/css">
<!--
body{ background:"blue"};
h1{font-family:monotype corsiva, font-style;bold;color:brown;position:absolute;left:400;};
p{font-family:monotype corsiva, font-style;italic;color:red;position:absolute;top:115;
font-size:19pt;}
-->
</style>
</head>
<body>
<h1>Welcome to right2 page </h1>
<p>this is a right2 page</p>
</body>
</html>
Right3.html
<html>
<head>
<title>this is a right3 page</title>
<style type="text/css">
<!--
body{background:tan;}
h1{font-family:monotype corsiva, font-style;bold;color:white;position:absolute;left:400;};
p{font-family:monotype corsiva, font-style;italic;color:silver;position:absolute;top:115;
font-size:19pt;background-color:gray}--></style></head>
<body bgcolor="black">
<h1> this is a right3 page</h1>
<p>this is a right3page</p>
</body></html>
Bottom File
<html>
<head>
<title>bottom</title>
<style type="text/css">
<!--
body{background-color:lavender;};
h1{font-family:times new roman, font-color:indigo;position:absolute;left:400;};
p{font-family:monotype corsiva;color:red;position:absolute;top:50;font-size:19pt;};
-->
</style>
</head>
<body >
<h1>Welcome to bottom page</h1>
<p>This is a bottom page</p>
</body>
</html>
No comments:
Post a Comment