html-frameset

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>frameset练习</title>
	</head>
	<frameset style="background-color: red;" cols="20%,80%">
		<!-- 列表 -->
		<frame name="liebiao" src="mulu.html"frameborder="no"framespacing="0px" noresize="noresize">
		<!-- 头部和表格 -->
		<frameset style="background-color: red;" rows="30%,70%">
			<!-- //头部 -->
			<frame name="toubu" src="top.html" frameborder="no" framespacing="0px" noresize="noresize">
			<!-- 表格 -->
			<frame name="bioage" src="body.html"frameborder="no"framespacing="0"noresize="noresize" >
		</frameset>
	</frameset>
</html>

左边

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>目录</title>
		<style>
			a{
				margin: 10px;
				font-size: 30px;
				color: white;
			}
			a:hover{
				color: red;
			}
		</style>
	</head>
	<body background="imgs/3.jpg"style="background-size: cover;
										background-attachment: fixed;
											">
				
				<ul  type="square">
					<a href="body.html" target="bioage" ><li>公司职员表</li></a>
					<a href="body2.html" target="bioage"><li>用户信息表</li></a>
					<a href="body3.html" target="bioage"><li>公司部门表</li></a>
					<a href="body4.html" target="bioage"><li>职员信息表</li></a>
				</ul>
				
		
	</body>
</html>

顶部

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>顶部</title>
	</head>
	<body background="imgs/14.jpg"style="background-size: cover;
										 background-attachment: fixed;">
					<h1 style="color: white; text-align: center;"align="center" >XXX公司内部信息管理系统</h1>
		
	</body>
</html>

表格

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>表格</title>
	</head>
	<body bgcolor="aqua">
		<center>
		<table border="1px" cellspacing="0px" cellpadding="3px"align="center"style="
																					text-align: center;
																					width: 600px;
																					height: 500px;
		">	<tr>
				<th colspan="6">查询
				 <input type="text" name="" id="" value="" placeholder="请输入员工编号"/>
				 <input type="button" name="" id="" value="查询" /></th>
			</tr>
			<tr><th colspan="6">公司职员表</th></tr>
			<tr><td>职员编号</td>
				<td>职员姓名</td>
				<td>职员职位</td>
				<td>职员职位</td>
				<td>职员职位</td>
				<td>职员职位</td>
			</tr>
			<tr><td>1001</td>
				<td>张三</td>
				<td>普通员工</td>
				<td>职员职位</td>
				<td>职员职位</td>
				<td>职员职位</td>
			</tr>
			<tr><td>1002</td>
				<td>张四</td>
				<td>普通员工</td>
				<td>职员职位</td>
				<td>职员职位</td>
				<td>职员职位</td>
			</tr>
			<tr><td>1003</td>
				<td>张五</td>
				<td>普通员工</td>
				<td>职员职位</td>
				<td>职员职位</td>
				<td>职员职位</td>
			</tr>
			<tr><td>1004</td>
				<td>张六</td>
				<td>普通员工</td>
				<td>职员职位</td>
				<td>职员职位</td>
				<td>职员职位</td>
			</tr>
		
		</table>
		</center>
		
	</body>
</html>

猜你喜欢

转载自blog.csdn.net/weixin_52192654/article/details/114385082