案例五：网站后台系统页面

最新推荐文章于 2024-08-03 22:03:50 发布

lk小强

最新推荐文章于 2024-08-03 22:03:50 发布

阅读量6.7k

点赞数 15

本文链接：https://blog.csdn.net/weixin_40807247/article/details/86499355

版权

JAVAWEB 专栏收录该内容

38 篇文章 0 订阅

订阅专栏

知识笔记—框架集标签、框架子标签

案例五：网站后台系统页面
框架集标签：

		<frameset rows="" cols="">
			<frame src=""/>
			<frame name=""/>
		</frameset>

在这里插入图片描述

需求：

一个网站需要有后台页面,后台页面设计：
在这里插入图片描述

技术分析：

【HTML的框架标签】

框架标签:<frameset >,标签与body标签是冲突,有frameset就可以没有body.
* 属性:
    * rows
    * cols
使用<frame>标签，frame代表切分的每个部分.

步骤分析:
【步骤一】创建一个html的页面
【步骤二】将整个页面分成上下两个部分.
【步骤三】将页面的下半部分分成左右两个部分.
【步骤四】在左侧页面中添加一些链接.
【步骤五】点击左侧链接,将页面的内容显示到右侧.

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>框架集标签</title>
	</head>
		<frameset cols="25%,*">
			<frame src="left.html"/>
			<frame src="right.html" />
		</frameset>	
</html>

在这里插入图片描述

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<font size="7">欢迎XXXX进入后台管理系统</font>
	</body>
</html>

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>左侧内容</title>
	</head>
	<body>
		<a href="right.html" target="right">会员管理</a><br /><br />
		<a href="#">品牌管理</a><br /><br />
		<a href="#">商品管理</a><br /><br />
		<a href="#">分类管理</a>
	</body>
</html>

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>右侧内容</title>
	</head>
	<body>
		所有用户信息
	</body>
</html>

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>网站的后台页面的显示</title>
	</head>
	<frameset rows="20%,*">
		<frame src="top.html">
		<frameset cols="20%,*">
			<frame src="left.html" />
			<frame name="right" />
		</frameset>
	</frameset>
</html>

在这里插入图片描述