后台管理系统
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>后台管理</title>
</head>
<frameset rows="150,*" >
<frame noresize="noresize" src="后台头部.html" />
<frameset cols="200,*">
<frame noresize="noresize" src="左侧内容.html" />
<frame noresize="noresize" src="网站主体.html" name="body" />
</frameset>
</frameset>
</html>
后台管理系统--后台头部.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>后台头部</title>
</head>
<body>
<h1 align="center">后台管理系统</h1>
</body>
</html>
后台管理系统--左侧.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>左侧内容</title>
</head>
<body>
<ul type="none">
<li><h3><a href="系统管理.html" target="body">系统管理</a></h3></li>
<li><h3><a href="人员管理.html" target="body">人员管理</a></h3></li>
<li><h3><a href="考勤管理.html" target="body">考勤管理</a></h3></li>
<li><h3><a href="内容管理.html" target="body">内容管理</a></h3></li>
<li><h3><a href="网站首页.html" target="body">网站首页</a></h3></li>
<li><h3><a href="修改密码.html" target="body">修改密码</a></h3></li>
</ul>
</body>
</html>
后台管理系统--网站主体.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>网站主体</title>
</head>
<body>
<h2>我是网站主体</h2>
</body>
</html>
后台管理系统--系统管理.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>系统管理</title>
</head>
<body>
我是系统管理
</body>
</html>
后台管理系统--人员管理.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>人员管理</title>
</head>
<body>
我是人员管理
</body>
</html>
后台管理系统--考勤管理.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>考勤管理</title>
</head>
<body>
我是考勤管理
</body>
</html>
后台管理系统--内容管理.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>内容管理</title>
</head>
<body>
我是内容管理
</body>
</html>
后台管理系统--网站首页.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>网站首页</title>
</head>
<body>
我是网站首页
</body>
</html>
后台管理系统--修改密码.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>修改密码</title>
</head>
<body>
我是修改密码
</body>
</html>
实现效果如下（项目虽小，还需要勤练习，如有其它具体要求，自己可适当添加。）：
点击左边每个项目，右边都会对应的显示。
原创：（未经同意，不得转载，谢谢！）