參考：韓順平 輕鬆搞定網頁設計
網上某網友寫的xscjManage
1.frameset 初級效果：
總共分三個html
all.html
<html>
<head>
</head>
<frameset cols = "50%,50%" frameborder = 0>
<frame src = "menu.html"/>
<frame src = "aa.html"/>
</frameset>
</html><html>
<head>
</head>
<body bgcolor = "yellow">
周杰倫的歌
</body>
</html>其中 aa.html
<html>
<head>
</head>
<body >
歌詞。。。
</body>
</html>2.frameset 中級效果
總共5個html
all2.html
<frameset rows = "30%,*" frameborder = "0" framespacing = "5" bordercolor = "red">
<frame src = "top.html" noresize scrolling = "yes"/>
<frameset cols = "20%,*">
<frame src = "left.html" noresize />
<frame src = "right.html" name = "right"/>
</frameset>
</frameset><img src = "0.jpg" />其中left.html
<body bgcolor ="pink">
<a href = "right.html" target = "right">aaa1</a><br/>
<a href = "ew.html" target = "right">aaa2</a><br/>
</body><body bgcolor ="silver">
right222222
</body>還有超鏈接的ew.html
<body>hhhaaaaaaaaaaa</body>每當在左邊框架中點擊超鏈接，這個超鏈接指向的頁面就會替換右邊框架裏的內容。
比如，點擊right.html.右邊框架頁面內容不發生改變如下圖上半部分
點擊ew.html ,右邊框架頁面內容則發生改變。如下圖下半部分
3.frameset在項目中的應用
很久之前我在網上當了一個項目，當時它的主界面設計就是根據這個知識點的，沒有用到css進行界面設計。
效果如下：
主要用到的前臺頁面如下：
main.jsp
<%@ page language="java" pageEncoding="UTF-8"%>
<html>
<head>
<title>學生成績管理系統</title>
</head>
<frameset rows="24%,68%,*" border="0">
<frame src="head.jsp">
<frameset cols="15%,*">
<frame src="left.jsp">
<frame src="right.jsp" name="right">
</frameset>
<frame src="foot.jsp">
</frameset>
<body>
</body>
</html>
其中引用的 head.jsp left.jsp right.jsp foot.jsp,如下
head.jsp
<%@ page language="java" pageEncoding="UTF-8"%>
<html>
<head>
<title>學生成績管理系統</title>
</head>
<body bgcolor="#D9DFAA">
<img src="/xscjManage/images/head.gif" />
</body>
</html>
foot.jsp
<%@ page language="java" pageEncoding="UTF-8"%>
<html>
<head>
<title>學生成績管理系統</title>
</head>
<body bgcolor="#D9DFAA">
</body>
</html>left.jsp
<%@ page language="java" pageEncoding="UTF-8"%>
<html>
<head>
<title>學生成績管理系統</title>
</head>
<body bgcolor="#D9DFAA" link="#D9DFAA" vlink="#D9DFAA">
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
<img src="/xscjManage/images/xsInfo.gif" width="184" height="47" />
</td>
</tr>
<tr>
<td>
<a href="addXsView.action" target="right"><img src="/xscjManage/images/addXs.gif" width="184" height="40" /></a>
</td>
</tr>
<tr>
<td>
<a href="xsInfo.action" target="right"><img src="/xscjManage/images/findXs.gif" width="184" height="40" /></a>
</td>
</tr>
<tr>
<td>
<img src="/xscjManage/images/kcInfo.gif" width="184" height="40" />
</td>
</tr>
<tr>
<td>
<a href="addKcView.action" target="right"><img src="/xscjManage/images/addKc.gif" width="184" height="39" /></a>
</td>
</tr>
<tr>
<td>
<a href="kcInfo.action" target="right"><img src="/xscjManage/images/findKc.gif" width="184" height="39" /></a>
</td>
</tr>
<tr>
<td>
<img src="/xscjManage/images/cjInfo.gif" width="184" height="40"/>
</td>
</tr>
<tr>
<td>
<a href="addXscjView.action" target="right"><img src="/xscjManage/images/addCj.gif" width="184" height="40" /></a>
</td>
</tr>
<tr>
<td>
<a href="xscjInfo.action" target="right"><img src="/xscjManage/images/findCj.gif" width="184" height="40" /></a>
</td>
</tr>
<tr>
<td>
<img src="/xscjManage/images/bottom.gif" width="184" height="40" />
</td>
</tr>
</table>
</body>
</html> 每當點擊左邊表格的一個action(會自動在後臺處理action內部的邏輯，然後通過Struts)，將要跳轉到對應的頁面,替換right.jsp。
比如：點擊左邊“課程信息查詢”圖片對應的action，會看到如下圖的效果
right.jsp
<%@ page language="java" pageEncoding="UTF-8"%>
<html>
<head>
<title>學生成績管理系統</title>
</head>
<body bgcolor="#D9DFAA">
</body>
</html>