Layui--iframe内嵌页面简单部署 

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <title></title>
  <link rel="stylesheet" href="layui/css/layui.css"><!-- css路径位置 -->
</head>
<body class="layui-layout-body" >
	<div class="layui-layout layui-layout-admin">
		  <div class="layui-header">
			<div class="layui-logo layui-unselect" style="padding:5px;font-size:25px;color: #ffffff;">；；</div>
			<!-- 头部区域（可配合layui已有的水平导航） -->
			<ul class="layui-nav layui-layout-left">
			  <li class="layui-nav-item"><a href="user.html" target="iframeMain">用户</a></li>
			</ul>
			<ul class="layui-nav layui-layout-right">
			  <li class="layui-nav-item" >
				<div class="layui-unselect" style="">chens</div>
			  </li>
			  <li class="layui-nav-item"><a href="">注销</a></li>
			</ul>
		  </div>
		  
		  <div class="layui-side layui-bg-black">
			<div class="layui-side-scroll">
			  <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
				<ul class="layui-nav layui-nav-tree"  lay-filter="test">
					<li class="layui-nav-item layui-nav-itemed">
						<div class="layui-unselect" style="padding:10px;font-size:20px;"></div>
						  <dl class="layui-nav-child">
							<!-- 打开方式设置iframeMain，内嵌页面打开方式-->
							<dd><a href="controlConsole.html" target="iframeMain" ></a></dd>
							<dd><a href="connect.html" target="iframeMain"></a></dd>
							<dd><a href="session.html" target="iframeMain"></a></dd>
							<dd><a href="topic.html" target="iframeMain"></a></dd>
							<dd><a href="subscibe.html" target="iframeMain"></a></dd>
						  </dl>
					</li>
				</ul>
				<ul class="layui-nav layui-nav-tree"  lay-filter="test">
					<li class="layui-nav-item layui-nav-itemed">
					  <div class="layui-unselect" style="padding:10px;font-size:20px;"></div>
					  <dl class="layui-nav-child">
						<dd><a href="plugIn.html" target="iframeMain"></a></dd>
						<dd><a href="monitor.html" target="iframeMain"></a></dd>
					  </dl>
					</li>
				</ul>
			</div>
		  </div>
	  
		<div class="layui-body" style="background-color: #f9f9f9;"><!--主题内容-->
			
			<!--src，主页面的默认的页面路径，name="iframeMain"内嵌设置-->
			 <iframe src="controlConsole.html" frameborder="0" class="layadmin-iframe" name="iframeMain"
			  style="width: 100%; height:100%;"></iframe>
		</div>
		
		<div class="layui-footer">
		    <!-- 底部固定区域 -->
		    底部固定区域
		</div>
	</div>
</body>
	<script src="layui/layui.js"></script>
	<script>
		
	</script>
</html>

　　

 

posted @ 2020-06-12 20:59  啄木鸟chens  阅读(4557)  评论(0)    收藏  举报