Layui--iframe內嵌頁面簡單部署

本文轉載自查看原文 2020-06-12 20:59 2515 layui

<!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>

免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。

猜您在找 layui 如果調用 from 內嵌入的 iframe子頁面方法 iframe 內嵌頁面傳值如何根據iframe內嵌頁面調整iframe高寬 html實現iframe內嵌頁面跳轉的demo iframe內嵌頁面——跨域通訊如何根據iframe內嵌頁面調整iframe高寬續篇彈出iframe內嵌頁面元素到父頁面並全屏化 layui 簡單登錄頁面 Layui后台實現頁面內部的iframe跳轉關於vue項目和內嵌iframe頁面之間的通信問題