laravel5.1框架基础之叶片模板继承简单使用方法分析

本文实例讲述了laravel5.1框架基础之叶片模板继承简单使用方法。分享给大家供大家参考，具体如下：

模板继承什么用？自然是增强基础页面的复用，有利于页面文档的条理，也便于更改多处使用的内容，如页头、页脚

1.用法概要

@include('common.header ')包含子视图@extends('article.common.base ')继承基础模板@yield('content ')视图占位符@section('content') @endsection继承模板后向视图占位符中填入内容{{ - 注释- }}刀片模板中注释的使用2.具体使用

2.1 新建文章基础模板base.blade.php

直接使用Bootstrap4模板代码及CDN，新建视图基础模板路径参考资料/视图/文章/公共/base.blade.php

！DOCTYPE html html lang=' en ' head title文章|标题在此/title meta charset=' utf-8 ' meta name=' viewport ' content=' width=device-width，initial-scale=1 ' meta http-equiv=' x-ua-compatible ' content=' ie=edge ' link rel='样式表href=' https://cdn。生饭桶。com/twbs/bootstrap/v4-dev/dist/CSS/bootstrap。CSS ' rel=' external nofollow ' rel=' external nofollow '/head dy {-1包含页头-} } @ include(' article。常见。标头'){ {-继承后插入的内容- }}@yield('content'){{ -包含页脚-} } @ include(' article。常见。页脚')脚本src=' http :3358 Ajax。useso。com/Ajax/libs/jquery/2。1 .4/jquery。量滴js '/script script src=' http :3359 cdn。生饭桶。com/twbs/bootstrap/v4-dev/dist/js/bootstrap。js '/脚本/正文/html 2。2。建子视图文件页头和页脚

页头文件参考资料/视图/文章/常用/header.blade.php

导航条导航条灯BG-褪色div class=' container ' a class=' nav bar-brand ' href=' # rel='外部nofollow ' rel='外部nofollow ' Articles/a ul class=' nav bar-nav ' Li class=' nav-item active ' a class=' nav-link ' href='/article ' rel='外部nofollow '首页span class='sr-only '(当前)/span/a/Li Li rel=“外部无跟随”rel=“外部无跟随”写文章/a/Li/ul ul class=' nav bar-nav pull-right ' Li class=' nav-item ' a href=' rel=' external nofollow ' rel=' external nofollow ' BTN BTN-小学-大纲'登录/a/Li Li class=' nav-item ' a href=' rel=' external nofollow ' rel=' external nofollow ' BTN BTN-成功-大纲'注册/a /li /ul/div/nav页脚文件参考资料/视图/文章/公共/页脚。 blade.php

div class=' footer ' style=' width : 100%；高度： 300像素背景-颜色： # 00b 388填充-top : 50px；div class=' container ' h1 style=' color : # FFFFFF；font-size : 1.5 em'文章/h1 /div/div2.3即可继承模板，实现复用

新建主页文件在参考资料/视图/文章/索引。blade.php

@ extends(' article。常见。base()@ section(' content ')div class=' container ' style=' height : 500 px；文本对齐：中心h1 style=' position :绝对值；左侧： 35%;前：名30%；"继承模板的主页搞定了！/h1 {{ -这里是叶片注释- }} /div@endsection2.4如何访问？

需要路由以及控制器配合，这里简单只用路由实现，详细内容请点击，以及接下来的其它文段

在app/Http/routes.php路由注册文件写上如下代码

Route:get('/')，function(){ return view(' article。索引')；});启动你的配置的laravel跑的服务器，比如我在目录地址下服务器端编程语言（Professional Hypertext Preprocessor的缩写）工匠服务

浏览器输入：localhost:8000，即可看到效果图

3.效果图

文章效果图|色彩#00B388

X bootstrap4起始模板代码

bootstrap4文档

！DOCTYPE htmlhtml lang='en' head！-必需的元标记总是排在第一位-元字符集='utf-8 '元名称=“视口”内容='宽度=器件宽度，初始比例=1 '元http-equiv=' x-ua-兼容'内容='ie=edge '！-引导CSS -链接rel='样式表href=' https://cdn。生饭桶。com/twbs/Bootstrap/v4-dev/dist/CSS/Bootstrap。CSS ' rel='外部不跟随' rel='外部不跟随'/头身h1你好，世界！/h1！-首先是jQuery，然后是自举JS .-script src=' http :http://Ajax。useso。com/Ajax/libs/jquery/2。1 .4/jquery。量滴js '/script script src=' http :https://cdn。生饭桶。com/twbs/bootstrap/v4-dev/dist/js/bootstrap。js '/脚本/正文/html更多关于Laravel相关内容感兴趣的读者可查看本站专题： 《Laravel框架入门与进阶教程》 、 《php优秀开发框架总结》 、 《php面向对象程序设计入门教程》 、 《php+mysql数据库操作入门教程》 及《php常见数据库操作技巧汇总》

希望本文所述对大家基于Laravel框架的服务器端编程语言(专业超文本预处理器的缩写)程序设计有所帮助。