摘要：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>欢迎</title> <link rel="stylesh
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>欢迎</title>
<link rel="stylesheet" type="text/css" href="/static/plugins/layui/css/layui.css">
<script type="text/javascript" src="/static/plugins/layui/layui.js"></script>
<style type="text/css">
body{margin: 0px}
.header{width: 100%; height: 50px;line-height:50px; background: #01AAED; color: #FFFFFF; }
.title{margin-left: 20px; font-size:20px;}
.userinfo{float: right; margin-right: 10px;}
.menu{width: 200px; background: #333744; position: absolute;}
.main{position: absolute; left:200px; right: 0px;}
.layui-collapse{border:none;}
.layui-colla-item{border-top: none;}
.layui-colla-title{background: #42485b;color:#FFFFFF;}
.layui-colla-content{ border-top:none ;padding: 0px;}
</style>
<div class="header">
<span class="title"> 后台管理系统</span>
<span class="userinfo" >admin<a href="javascript:;">退出</a> </span>
</div>
</head>
<body>
<!---左方菜单-->
<div class="menu" id="menu">
<div class="layui-collapse" lay-accordion>
<div class="layui-colla-item">
<h2 class="layui-colla-title">主菜单</h2>
<div class="layui-colla-content">
<ul class="layui-nav layui-nav-tree">
<li class="layui-nav-item"><a href="javascript:;">菜单列表</a> </li>
</ul>
</div>
</div>
</div>
</div>
<!-- 主操作区-->
<div class="main">
<iframe src="/index.php/admin/home/welcome" onload="resetMainHeight(this)" style="width: 100%; height: 100%" frameborder="0" scrolling="0"></iframe>
</div>
</body>
</html>
<script type="text/javascript">
layui.use(['element','layer'], function(){
var element = layui.element;
$ = layui.jquery;
layer = layui.layer;
resetMenuHeight();
});
//重新设置页面高度
function resetMenuHeight(obj) {
var height= document.document.documentElement.clientHeight - 50;
$('#menu').height(height);
}
//重设主操作区高度
function resetMainHeight(obj) {
var height= parent.document.documentElement.clientHeight - 53;
$(obj).parent('div').height(height);
}
</script>
批改老师：韦小宝批改时间：2019-02-11 10:13:54
老师总结：写的很不错 使用layui来实现方面又快捷 而且还美观 继续加油吧！
