Programs for Frames

by
Prof. A. Schlissel


Frames template
<html>
<head>
<title>frames0</title>
</head>
<frameset>

</frameset>
</html>


Two vertical frames
<html>
<head>
<title>frames1</title>
</head>
<frameset cols="30%, *">

      <frame src="left.htm">
      <frame src="right.htm">

</frameset>
</html>


Click to view


<html>
<head>
<title>left</title>
</head>
<body bgcolor=yellow text=black>
<h3><center>this is the left side</center></h3>
</body>
</html>

<html>
<head>
<title>right</title>
</head>
<body bgcolor=yellow text=black>
<h3><center>this is the right side</center></h3>
</body>
</html>


Two horizontal frames
<html>
<head>
<title>frames2</title>
</head>
<frameset rows="50%, *">

      <frame src="top.htm">
      <frame src="bot.htm">

</frameset>
</html>


Click to view


<html>
<head>
<title>top.htm</title>
</head>
<body bgcolor=yellow text=black>
<h3><center>this is the top</center></h3>
</body>
</html>

<html>
<head>
<title>bot.htm</title>
</head>
<body bgcolor=yellow text=black>
<h3><center>this is the bottom</center></h3>
</body>
</html>


Two horizontal frames with the lower frame divided into two vertical frames
<html>
<head>
<title>frames3</title>
</head>
<frameset rows="20%, *">
      <frame src=banner1.htm>
      <frameset cols="30%, *">
            <frame src="left.htm">
            <frame src="right.htm">
      </frameset>
</frameset>
</html>


Click to view


<html>
<head>
<title>banner1.htm</title>
</head>
<body bgcolor=yellow text=black>
<h3><center>this is a "banner"</center></h3>
</body>
</html>


Three horizontal frames with the middle one divided into two vertical frames
<html>
<head>
<title>frames4</title>
</head>
<frameset rows="20%, *, 15%">
      <frame src=banner1.htm>
      
      <frameset cols="30%, *">
            <frame src="left.htm">
            <frame src="right.htm">
      </frameset>
      
      <frame src="banner2.htm">
</frameset>
</html>


Click to view


<html>
<head>
<title>banner2</title>
</head>
<body bgcolor=yellow text=black>
<h3><center><i>this is another "banner"</i></center></h3>
</body>
</html>


Two vertical frames with a large border
<html>
<head>
<title>frames5</title>
</head>
<frameset cols="30%, *" border=30>

      <frame src="left.htm">
      <frame src="right.htm">

</frameset>
</html>


Click to view


Two vertical frames with no border
<html>
<head>
<title>frames6</title>
</head>
<frameset cols="30%, *" border=0>

      <frame src="left.htm">
      <frame src="right.htm">

</frameset>
</html>


Click to view



Two vertical frames with a border color
<html>
<head>
<title>frames7</title>
</head>
<frameset cols="30%, *" border=10 bordercolor="blue">

      <frame src="left.htm">
      <frame src="right.htm">

</frameset>
</html>


Click to view



A horizontal frame with two vertical frames underneath. The right vertical frame is the target of the links in the left vertical frame.
<html>
<head>
<title>frames8</title>
</head>
<frameset rows="20%, *">
      <frame src="banner3.htm">

      <frameset cols="30%, *" border=1 bordercolor="red">
            <frame src="menu2.htm">
            <frame src="result.htm" name=right_window>
      </frameset>

</frameset>
</html>


Click to view



<html>
<head>
<title>banner3</title>
</head>
<body bgcolor=yellow text=black>
<h2><center>Schlissel's Nutrition Center</center></h2>
</body>
</html>

<html>
<head>
<title>menu2</title>
</head>
<body bgcolor=yellow text=black>
<h3><center>Menu</center></h3>
<h4>
<ul>
      <li><a href="veg.htm" target="right_window">Vegetarian diet</a>
      <li><a href="meat.htm" target="right_window">Meat diet</a>
      <li><a href="dairy.htm" target="right_window">Dairy diet</a>
</ul>
</h4>
</body>
</html>


<html>
<head>
<title>result</title>
</head>
<body bgcolor=yellow text=black>
<h4><center>this is the result page</center></h4>
</body>
</html>


<html>
<head>
<title>veg</title>
</head>
<body bgcolor=yellow text=black>
<h4><center>Vegetarian diet</center>
<ul>
      <li>potatoes
      <li>cucumbers
      <li>tomatoes
</ul>
</h4>
</body>
</html>


<html>
<head>
<title>meat</title>
</head>
<body bgcolor=yellow text=black>
<h4><center>Meat diet</center>
<ul>
      <li>chicken
      <li>turkey
      <li>lamb
</ul>
</h4>
</body>
</html>


<html>
<head>
<title>dairy</title>
</head>
<body bgcolor=yellow text=black>
<h4><center>Dairy diet</center>
<ul>
      <li>cheese
      <li>bread
      <li>lettuce
      <li>yogurt
</ul>
</h4>
</body>
</html>


<html>
<head>
<title>frames9</title>
</head>
<frameset cols="30%, *" border=10>

      <frame src="left.htm" bordercolor="red">
      <frame src="right.htm" bordercolor="blue">

</frameset>
</html>


Click to view


Back to HTML program page