<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>window.open</title>
<style type="text/css">
/* 大盒子的样式设计 */
.con{
height: 800px;
background-color: blue;
}
/* 左边菜单栏的样式设计 */
.nav1{
height: 500px;
width: 190px;
background-color: yellow;
float: left;
}
/* 右边内容的样式设计 右边内容的宽高,自行设计*/
#page_content{
float:right;
width: 1100px;
height: 700px;
background-color: red;
}
</style>
</head>
<body>
<div class="con">
<div class="nav1">
<ul class="nav" id="side-menu"> /* 注意:此处的链接1.html到4.html就是显示的右边内容 */
<li><a href="1.html" target="menuFrame">统计报表</a></li>
<li><a href="2.html" target="menuFrame">仓库管理</a></li>
<li><a href="3.html"target="menuFrame">订单管理</a></li>
<li><a href="4.html" target="menuFrame">系统设置</a></li>
<li><a href="rewritepwd.html" target="menuFrame">修改密码</a></li>
</ul>
</div>
<div id="page_content"> /* 注意:上面的menuFrame不能更改,要求全部一样,如不要滚动条,自己将scrolling改为 no*/
<iframe id="menuFrame" name="menuFrame" src="1.html" style="overflow:visible;" scrolling="yes"
frameborder="no" width="100%" height="100%" ></iframe>
</div>
</div>
</body>
</html>