摘要：模板布局模板继承应用标签方式（比较灵活方便）在需要模板布局的页面引入以下标签，不需要则啥都不用写【replace="[__TEXTS__]"】感觉这段代码比较鸡肋，换个变量名难道会更安全？不大明白了{layout name="layout" replace="[__TEXTS__]" /}在需要模板继承的页面引入以下标签{extend n
模板布局模板继承应用标签方式（比较灵活方便）
在需要模板布局的页面引入以下标签，不需要则啥都不用写【replace="[__TEXTS__]"】感觉这段代码比较鸡肋，换个变量名难道会更安全？不大明白了
{layout name="layout" replace="[__TEXTS__]" /}
在需要模板继承的页面引入以下标签
{extend name="base" /}
index.html[全部代码]
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>后台管理系统</title>
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="__ADTP__/css/font.css">
<link rel="stylesheet" href="__ADTP__/css/xadmin.css">
<script type="text/javascript" src="__ADTP__/js/jquery.js"></script>
<script src="__ADTP__/lib/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="__ADTP__/js/xadmin.js"></script>
</head>
<body>
<!-- 顶部开始 -->
<div>
<div><a href="{:url('index/index')}">后台管理系统</a></div>
<ul class="layui-nav right" lay-filter="">
<li>
<a href="javascript:;">admin</a>
<dl> <!-- 二级菜单 -->
<dd><a onclick="x_admin_show('个人信息','http://www.baidu.com')">个人信息</a></dd>
<dd><a onclick="x_admin_show('切换帐号','http://www.baidu.com')">切换帐号</a></dd>
<dd><a href="__ADTP__/login.html">退出</a></dd>
</dl>
</li>
<li class="layui-nav-item to-index"><a href="/">前台首页</a></li>
</ul>
</div>
<!-- 顶部结束 -->
<!-- 左侧菜单开始 -->
<div class="left-nav">
<div id="side-nav">
<ul id="nav">
<li>
<a href="javascript:;">
<i class="iconfont"></i>
<cite>管理员管理</cite>
<i class="iconfont nav_right"></i>
</a>
<ul class="sub-menu">
<li>
<a _href="admin-list.html">
<i class="iconfont"></i>
<cite>管理员列表</cite>
</a>
</li >
</ul>
</li>
<li>
<a href="javascript:;">
<i class="iconfont"></i>
<cite>新闻管理</cite>
<i class="iconfont nav_right"></i>
</a>
<ul class="sub-menu">
<li>
<a _href="order-list.html">
<i class="iconfont"></i>
<cite>新闻列表</cite>
</a>
</li >
</ul>
</li>
<li>
<a href="javascript:;">
<i class="iconfont"></i>
<cite>产品管理</cite>
<i class="iconfont nav_right"></i>
</a>
<ul class="sub-menu">
<li>
<a _href="order-list.html">
<i class="iconfont"></i>
<cite>产品列表</cite>
</a>
</li >
</ul>
</li>
<li>
<a href="javascript:;">
<i class="iconfont"></i>
<cite>分类管理</cite>
<i class="iconfont nav_right"></i>
</a>
<ul class="sub-menu">
<li>
<a _href="cate.html">
<i class="iconfont"></i>
<cite>分类列表</cite>
</a>
</li >
</ul>
</li>
<li>
<a href="javascript:;">
<i class="iconfont"></i>
<cite>系统设置</cite>
<i class="iconfont nav_right"></i>
</a>
<ul class="sub-menu">
<li>
<a _href="system.html">
<i class="iconfont"></i>
<cite>系统设置</cite>
</a>
</li >
<li>
<a _href="cate.html">
<i class="iconfont"></i>
<cite>分类列表</cite>
</a>
</li >
</ul>
</li>
</ul>
</div>
</div>
<!-- <div class="x-slide_left"></div> -->
<!-- 左侧菜单结束 -->
<!-- 中部开始 -->
<!-- 右侧主体开始 -->
<div class="page-content">
<div class="layui-tab tab" lay-filter="xbs_tab" lay-allowclose="false">
<ul class="layui-tab-title">
<li class="home"><i class="layui-icon"></i>我的桌面</li>
</ul>
<div class="layui-tab-content">
<div class="layui-tab-item layui-show">
<iframe src="{:url('welcome')}" frameborder="0" scrolling="yes" class="x-iframe"></iframe>
</div>
</div>
</div>
</div>
<!-- 底部结束 -->
</body>
</html>
------对index进行模板布局和模板继承操作
pubLic文件夹下建立head和menu对应的html文件
head.html
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>后台管理系统</title>
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="__ADTP__/css/font.css">
<link rel="stylesheet" href="__ADTP__/css/xadmin.css">
<script type="text/javascript" src="__ADTP__/js/jquery.js"></script>
<script src="__ADTP__/lib/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="__ADTP__/js/xadmin.js"></script>
</head>
<body>
<!-- 顶部开始 -->
<div>
<div><a href="{:url('index/index')}">后台管理系统</a></div>
<ul class="layui-nav right" lay-filter="">
<li>
<a href="javascript:;">admin</a>
<dl> <!-- 二级菜单 -->
<dd><a onclick="x_admin_show('个人信息','http://www.baidu.com')">个人信息</a></dd>
<dd><a onclick="x_admin_show('切换帐号','http://www.baidu.com')">切换帐号</a></dd>
<dd><a href="__ADTP__/login.html">退出</a></dd>
</dl>
</li>
<li class="layui-nav-item to-index"><a href="/">前台首页</a></li>
</ul>
</div>
<!-- 顶部结束 -->
menu.html
<!-- 左侧菜单开始 -->
<div class="left-nav">
<div id="side-nav">
<ul id="nav">
<li>
<a href="javascript:;">
<i class="iconfont"></i>
<cite>管理员管理</cite>
<i class="iconfont nav_right"></i>
</a>
<ul class="sub-menu">
<li>
<a _href="admin-list.html">
<i class="iconfont"></i>
<cite>管理员列表</cite>
</a>
</li >
</ul>
</li>
<li>
<a href="javascript:;">
<i class="iconfont"></i>
<cite>新闻管理</cite>
<i class="iconfont nav_right"></i>
</a>
<ul class="sub-menu">
<li>
<a _href="order-list.html">
<i class="iconfont"></i>
<cite>新闻列表</cite>
</a>
</li >
</ul>
</li>
<li>
<a href="javascript:;">
<i class="iconfont"></i>
<cite>产品管理</cite>
<i class="iconfont nav_right"></i>
</a>
<ul class="sub-menu">
<li>
<a _href="order-list.html">
<i class="iconfont"></i>
<cite>产品列表</cite>
</a>
</li >
</ul>
</li>
<li>
<a href="javascript:;">
<i class="iconfont"></i>
<cite>分类管理</cite>
<i class="iconfont nav_right"></i>
</a>
<ul class="sub-menu">
<li>
<a _href="cate.html">
<i class="iconfont"></i>
<cite>分类列表</cite>
</a>
</li >
</ul>
</li>
<li>
<a href="javascript:;">
<i class="iconfont"></i>
<cite>系统设置</cite>
<i class="iconfont nav_right"></i>
</a>
<ul class="sub-menu">
<li>
<a _href="system.html">
<i class="iconfont"></i>
<cite>系统设置</cite>
</a>
</li >
<li>
<a _href="cate.html">
<i class="iconfont"></i>
<cite>分类列表</cite>
</a>
</li >
</ul>
</li>
</ul>
</div>
</div>
<!-- <div class="x-slide_left"></div> -->
<!-- 左侧菜单结束 -->
layout.html
{include file="public/head" /}
{include file="public/menu" /}
[__TEXTS__]
base.html
{block name="course"}后台管理{/block}
引入模板布局后的index.html
{layout name="layout" replace="[__TEXTS__]" /}
<!-- 中部开始 -->
<!-- 右侧主体开始 -->
<div class="page-content">
<div class="layui-tab tab" lay-filter="xbs_tab" lay-allowclose="false">
<ul class="layui-tab-title">
<li class="home"><i class="layui-icon"></i>我的桌面</li>
</ul>
<div class="layui-tab-content">
<div class="layui-tab-item layui-show">
<iframe src="{:url('welcome')}" frameborder="0" scrolling="yes" class="x-iframe"></iframe>
</div>
</div>
</div>
</div>
<!-- 底部结束 -->
</body>
</html>
引入模板继承后的welcome.html
{extend name="base" /}
{block name="course"}
<div style="text-align: center;color:gray;font-size: 20px;">
<h1>欢迎使用{__block__}系统</h1>
</div>
{/block}
批改老师：韦小宝批改时间：2018-11-01 17:35:48
老师总结：作业中或者视频中遇到什么不懂的或者是不会的可以到工单中进行提问哦！这里不方便解答和交流的哦！作业写的很不错！下次记得多加点总结！以及代码要记得高亮哦！继续加油学习吧！！
