<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>实验上下分布格局</title>
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<link href="Zui/css/zui.min.css" rel="stylesheet">
<link rel="stylesheet" href="Zui/css/main.css">
<link rel="stylesheet" href="Zui/css/main-color.css">
<!--IE8只能支持jQuery1.9-->
<!--[if lte IE 8]>
<script src="http://cdn.bootcss.com/jquery/1.9.0/jquery.min.js"></script>
<![endif]-->
<!--[if lt IE 9]>
<script src="jquery-1.9.0.js">
<![endif]-->
<!--[if lt IE 9]>
<script src="dist/lib/ieonly/html5shiv.js"></script>
<![endif]-->
<!--[if lt IE 9]>
<script src="dist/lib/ieonly/respond.js"></script>
<![endif]-->
<!--[if lt IE 9]>
<script src="dist/lib/ieonly/excanvas.js"></script>
<![endif]-->
</head>
<body>
<!--[if lt IE 8]>
<div class="alert alert-danger">您正在使用 <strong>过时的</strong> 浏览器. 是时候 <a href="http://browsehappy.com/">更换一个更好的浏览器</a> 来提升用户体验.</div>
<![endif]-->
<div class="fill">
<div class="row fill">
<div class="col-md-12 column top row" style="height: 40px;">
<div class="top_logo_box" style="">LOGO</div>
<span class="icon icon-align-justify nav_icon shrink"></span>
<div style="float: left;margin-left: 20px">
<li style="float: left;">
<span class="icon icon-home nav_icon"></span>
</li>
<li style="float: left;">
<span class="icon icon-asterisk nav_icon"></span>
</li>
<li style="float: left;">
<span class="icon icon-envelope nav_icon"></span>
</li>
</div>
<div style="float: right;margin-right: 20px;">
<li style="float: right;">
<span class="icon icon-off nav_icon"></span>
</li>
<li style="float: right;">
<span class="icon icon-user nav_icon"></span>
<span style="padding-left: 5px">admin</span>
</li>
<li style="float: right;">
<span class="icon icon-cog nav_icon options"></span>
</li>
</div>
</div>
<div class="col-md-1 column left row">
<!-- 自写nav -->
<ul class="col-md-12 left_nav">
<li>
<a href="#" name="other/home.html" class="nav_boss nav_shrink_a nav_boss_select" >
<span class="icon icon-home nav_boss_icon"></span>
<span class="nav_boss_text">首页</span>
</a>
<ul class="nav_shrink">
</ul>
</li>
<li>
<a href="#" class="nav_boss">
<span class="icon icon-book nav_boss_icon"></span>
<span class="nav_boss_text">基础<b class="caret"></b></span>
</a>
<ul class="nav_shrink">
<a href="#" name="other/Control_icon.html" class="nav_shrink_a"><li class="nav_shrink_li"><span class="icon icon-star"></span>图标</li></a>
<a href="#" name="other/Control_buttons.html" class="nav_shrink_a"><li class="nav_shrink_li"><span class="icon icon-bold"></span>按钮</li></a>
<a href="#" name="other/Control_dialog_box.html" class="nav_shrink_a"><li class="nav_shrink_li"><span class="icon icon-check-empty"></span>对话框</li></a>
<a href="#" name="other/Control_float_news.html" class="nav_shrink_a"><li class="nav_shrink_li"><span class="icon icon-comment-alt"></span>漂浮消息</li></a>
<a href="#" name="other/Control_paging.html" class="nav_shrink_a"><li class="nav_shrink_li"><span class="icon text-icon">Go</span>分页器</li></a>
</ul>
</li>
<li>
<a href="#" class="nav_boss">
<span class="icon icon-check-empty nav_boss_icon"></span>
<span class="nav_boss_text">控件<b class="caret"></b></span>
</a>
<ul class="nav_shrink">
<a href="#" name="other/Control_Datepicker.html" class="nav_shrink_a"><li class="nav_shrink_li"><span class="icon icon-calendar"></span>日期选择</li></a>
<a href="#" name="other/Control_sorting.html" class="nav_shrink_a"><li class="nav_shrink_li"><span class="icon icon-sort"></span>拖拽排序</li></a>
</ul>
</li>
<li>
<a href="#" class="nav_boss">
<span class="icon icon-list-alt nav_boss_icon"></span>
<span class="nav_boss_text">视图组件<b class="caret"></b></span>
</a>
<ul class="nav_shrink">
<a href="#" name="other/view_table.html" class="nav_shrink_a"><li class="nav_shrink_li"><span class="icon icon-table"></span>数据表格</li></a>
<a href="#" name="other/view_tab.html" class="nav_shrink_a"><li class="nav_shrink_li"><span class="icon icon-credit"></span>标签页</li></a>
<a href="#" name="other/View_tree_menu.html" class="nav_shrink_a"><li class="nav_shrink_li"><span class="icon icon-th-list"></span>树形菜单</li></a>
<a href="#" name="other/View_files_upload.html" class="nav_shrink_a"><li class="nav_shrink_li"><span class="icon icon-cloud-upload"></span>文件上传</li></a>
<a href="#" name="other/View_organization.html" class="nav_shrink_a"><li class="nav_shrink_li"><span class="icon icon-sitemap"></span>组织结构</li></a>
</ul>
</li>
<li>
<a href="#" class="nav_boss">
<span class="icon icon-file nav_boss_icon"></span>
<span class="nav_boss_text">引入插件<b class="caret"></b></span>
</a>
<ul class="nav_shrink">
<a href="#" name="other/echarts.html" class="nav_shrink_a"><li class="nav_shrink_li"><span class="icon icon-line-chart"></span>可视化图表</li></a>
<a href="#" name="other/GridManager.html" class="nav_shrink_a"><li class="nav_shrink_li"><span class="icon icon-table"></span>GridManager</li></a>
</ul>
</li>
</ul>
</div>
<div class="col-md-11 column right row">
<div class="black"></div>
<div class="col-md-12 fill">
<iframe class="iframe" src="other/home.html" frameborder="0" style="width: 100%;height: 100%"></iframe>
<div class="options_box fill" style="none">
</div>
</div>
</div>
</div>
</div>
</body>
<script src="Zui/js/jquery.min.js"></script>
<script src="Zui/js/zui.min.js"></script>
<script src="Zui/js/main.js"></script>
</html>
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"><!--响应式移动端-->
<link href="Zui/css/zui.min.css" rel="stylesheet"><!--Zui-->
<link rel="stylesheet" href="Zui/css/main.css"><!--引入样式-->
<link rel="stylesheet" href="Zui/css/main-color.css"><!--引入样式颜色包-->
<script src="Zui/js/jquery.min.js"></script><!--引入Jquery-->
<script src="Zui/js/zui.min.js"></script><!--引入Zui-->
<script src="Zui/js/main.js"></script><!--引入互动js-->
<div class="fill">
<div class="row fill">
<div class="col-md-12 column top row" style="height: 40px;">
<!--顶部内容区域-->
<div class="top_logo_box" style="">
<!--logo区域-->
</div>
<span class="icon icon-align-justify nav_icon shrink"></span>
</div>
<div class="col-md-1 column left row">
<!--左侧区域-->
</div>
<div class="col-md-11 column right row">
<div class="black"></div>
<div class="col-md-12 fill">
<!--右侧区域-->
</div>
</div>
</div>
</div>
<!--左侧nav-->
<ul class="col-md-12 left_nav">
<li>
<a href="#" name="other/home.html" class="nav_boss nav_shrink_a nav_boss_select" >
<span class="icon icon-home nav_boss_icon"></span>
<span class="nav_boss_text">首页</span>
</a>
<ul class="nav_shrink">
</ul>
</li>
<li>
<a href="#" class="nav_boss">
<span class="icon icon-book nav_boss_icon"></span>
<span class="nav_boss_text">基础<b class="caret"></b></span>
</a>
<ul class="nav_shrink">
<a href="#" name="other/Control_icon.html" class="nav_shrink_a"><li class="nav_shrink_li"><span class="icon icon-star"></span>图标</li></a>
<a href="#" name="other/Control_buttons.html" class="nav_shrink_a"><li class="nav_shrink_li"><span class="icon icon-bold"></span>按钮</li></a>
<a href="#" name="other/Control_dialog_box.html" class="nav_shrink_a"><li class="nav_shrink_li"><span class="icon icon-check-empty"></span>对话框</li></a>
<a href="#" name="other/Control_float_news.html" class="nav_shrink_a"><li class="nav_shrink_li"><span class="icon icon-comment-alt"></span>漂浮消息</li></a>
<a href="#" name="other/Control_paging.html" class="nav_shrink_a"><li class="nav_shrink_li"><span class="icon text-icon">Go</span>分页器</li></a>
</ul>
</li>
<li>
<a href="#" class="nav_boss">
<span class="icon icon-check-empty nav_boss_icon"></span>
<span class="nav_boss_text">控件<b class="caret"></b></span>
</a>
<ul class="nav_shrink">
<a href="#" name="other/Control_Datepicker.html" class="nav_shrink_a"><li class="nav_shrink_li"><span class="icon icon-calendar"></span>日期选择</li></a>
<a href="#" name="other/Control_sorting.html" class="nav_shrink_a"><li class="nav_shrink_li"><span class="icon icon-sort"></span>拖拽排序</li></a>
</ul>
</li>
<li>
<a href="#" class="nav_boss">
<span class="icon icon-list-alt nav_boss_icon"></span>
<span class="nav_boss_text">视图组件<b class="caret"></b></span>
</a>
<ul class="nav_shrink">
<a href="#" name="other/view_table.html" class="nav_shrink_a"><li class="nav_shrink_li"><span class="icon icon-table"></span>数据表格</li></a>
<a href="#" name="other/view_tab.html" class="nav_shrink_a"><li class="nav_shrink_li"><span class="icon icon-credit"></span>标签页</li></a>
<a href="#" name="other/View_tree_menu.html" class="nav_shrink_a"><li class="nav_shrink_li"><span class="icon icon-th-list"></span>树形菜单</li></a>
<a href="#" name="other/View_files_upload.html" class="nav_shrink_a"><li class="nav_shrink_li"><span class="icon icon-cloud-upload"></span>文件上传</li></a>
<a href="#" name="other/View_organization.html" class="nav_shrink_a"><li class="nav_shrink_li"><span class="icon icon-sitemap"></span>组织结构</li></a>
</ul>
</li>
<li>
<a href="#" class="nav_boss">
<span class="icon icon-file nav_boss_icon"></span>
<span class="nav_boss_text">引入插件<b class="caret"></b></span>
</a>
<ul class="nav_shrink">
<a href="#" name="other/echarts.html" class="nav_shrink_a"><li class="nav_shrink_li"><span class="icon icon-line-chart"></span>可视化图表</li></a>
<a href="#" name="other/GridManager.html" class="nav_shrink_a"><li class="nav_shrink_li"><span class="icon icon-table"></span>GridManager</li></a>
</ul>
</li>
</ul>
<!--右侧iframe-->
<iframe class="iframe" src="other/sy.html" frameborder="0" style="width: 100%;height: 100%"></iframe>
iframe引入内容
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>小标题</title>
<link rel="stylesheet" href="../Zui/css/zui.min.css">
<!--IE8只能支持jQuery1.9-->
<!--[if lte IE 8]>
<script src="http://cdn.bootcss.com/jquery/1.9.0/jquery.min.js"></script>
<![endif]-->
<!--[if lt IE 9]>
<script src="jquery-1.9.0.js">
<![endif]-->
<!--[if lt IE 9]>
<script src="dist/lib/ieonly/html5shiv.js"></script>
<![endif]-->
<!--[if lt IE 9]>
<script src="dist/lib/ieonly/respond.js"></script>
<![endif]-->
<!--[if lt IE 9]>
<script src="dist/lib/ieonly/excanvas.js"></script>
<![endif]-->
</head>
<body style="width: 96%;margin:20px 2%;margin-bottom: 60px;background-color: #f5f5f5">
<!--[if lt IE 8]>
<div class="alert alert-danger">您正在使用 <strong>过时的</strong> 浏览器. 是时候 <a href="http://browsehappy.com/">更换一个更好的浏览器</a> 来提升用户体验.</div>
<![endif]-->
</body>
<script src="../Zui/js/jquery.min.js"></script>
<script src="../Zui/js/zui.min.js"></script>
</html>
如若想修改主题颜色,可以参考设置页面中颜色
将
<link rel="stylesheet" href="zui/css/main-color.css">
替换成:
<link rel="stylesheet" href="Zui/css/theme/mashup_66c8d9.css">