laravel用模板继承实现圣杯模型

于 2022-04-13 21:46:53 发布
阅读量231 收藏 1
点赞数
分类专栏： laravel 文章标签： laravel
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/klx2545845553/article/details/124158929
版权

父模板

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title></title>
</head>
<body>
    <div class="container">
        <div class="header">
            @section('header')
            <h1>头</h1>
            @show
        </div>
        <div class="left">
            @section('left')
            <h1>左</h1>
            @show
        </div>
        <div class="right">
            @section('right')
            <h1>右</h1>
            @show
        </div>
        <div class="main">
            @section('main')
            <h1>中</h1>
            @show
        </div>
        <div class="footer">
            @section('footer')
            <h1>页脚</h1>
            @show
        </div>
    </div>
</body>
<style type="text/css">
   /* *{
            margin: 0;
            padding: 0;
        }*/
    .container{
        border:3px solid red;
        height: 600px;
       /* margin: 20px 20px 20px 20px;*/
       position: relative;

    }
    .header{
        border:1px solid red;
        text-align: center;
        overflow:hidden;
        top: 0;
        width: 100%;
        height: 80px;
    }
    .left{
         width: 200px;
        height: 400px;
        border:1px solid lightgreen;
        float: left;
            text-align: center;
            line-height: 400px;
    }
    .main{
        border:2px solid blue;
        height: 400px;
        text-align: center;
        float: left;
        width: 1000px;
    }
     .right{
         width: 200px;
        height: 400px;
        border:2px solid green;
        float: right;
            text-align: center;
            line-height: 400px;
    }
    .footer{
        border:2px solid lightcoral;
        text-align: center;
        position: absolute;
        bottom: 0; /* 4. 设置页脚position为absolute之后，再将其bottom值设为0，即可使其处于页面的底部 */
        height: 110px;
        width: 100%;
    }
</style>
</html>

模板继承

@extends('layout.modelfather')
@section('title',"圣杯")
@section('header')
<h1>header</h1>
@endsection
@section('left')
<h3>left</h3>
@endsection
@section('right')
<h3>right</h3>
@endsection
@section('main')
<h1>圣杯模型</h1>
@endsection
@section('footer')
<h3>footer</h3>
@endsection

请添加图片描述

klx2545845553
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
圣杯布局，简单的模式模板
10-11
HTML代码描述如何在网页中制作简单的网页布局，代码简单，便于理解。
圣杯模型
Paranoid_truggle的博客
07-14 260
浮动布局 </div>
php laravel组件,Laravel 自定义视图组件
weixin_39853210的博客
04-13 248
Laravel 的视图合成器可将数据与指定视图绑定在一起，避免了重复编写代码。View::composer('profile', 'App\Http\View\Composers\ProfileComposer');由于数据的生成和渲染是分开进行的，理解起来不够直观。因此，可以采用视图组件的方式将两者进行封装。...
laravel创建新model数据的两种方法
matiascx的博客
07-31 3390
laravel中的CRUD操作中，通过对代表数据表中row的model对象操作，来更新数据库表。 对于创建新的row的操作，有两种功能上相同的方法： 1.create； $user = User::create(array('email => 'xx@yy.zz','password'=>'mypassword')); 2.new and save $user = new U
JavaScript使用原型和原型链实现对象继承的方法详解
10-20
JavaScript中的对象继承是基于原型和原型链的...在实际开发中，为了更好地管理和优化代码，还可以使用类（class）语法（ES6引入），它提供了更接近传统面向对象语言的语法糖，但底层仍然是基于原型和原型链的继承机制。
JS继承的实现方式
06-14
### JS继承的实现方式 JavaScript作为一种灵活且功能强大的编程语言，支持多种继承模式。下面将详细介绍几种常见的继承实现方式，并探讨它们的特点与应用场景。 #### 一、原型链继承 **核心思想**: 将父类的实例...
圣杯布局实现思路1
08-03
圣杯布局实现思路1
双飞翼布局和圣杯布局
01-08
 首先三个元素横向排列，用浮动实现。 .center{float: left;} .left{float: left;} .right{float: left;}  就是中间的在最前面，而且宽度没有自适应网页。中间区域用宽度百分百解决，位置用margin-left移动。 ....
laravel 5.1 Model 属性详解
weixin_34124577的博客
12-30 239
<?php namespace Illuminate\Database\Eloquent; /** * 下面提到某些词的含义： * 1、覆盖： 在继承该类 \Illuminate\Database\Eloquent\Model 的自定义的模型类中， 定义一个同名 field，值不一样 */ abstract class Model1 implement...
laravel Model 执行事务
woshihaiyong168的博客
04-21 5192
1.官方手册是这样介绍的: 想要在一个数据库事务中运行一连串操作，可以使用DB门面的transaction方法，如果事务闭包中抛出异常，事务将会自动回滚。如果闭包执行成功，事务将会自动提交。使用transaction方法时不需要担心手动回滚或提交： DB::transaction(function () { DB::table('users')->update(['votes'
laravel 模板继承 包含
昊喵喵博士
12-06 762
6、包含子视图 Blade 的 @include 指令允许你很轻松地在一个视图中包含另一个 Blade 视图，所有父级视图中变量在被包含的子视图中依然有效： &lt;div&gt; @include('shared.errors') &lt;form&gt; &lt;!-- Form Contents --&gt; &lt;/form&gt; &lt...
laravel Blade模版继承用法
xinzi11243094的博客
05-28 2192
一.创建一个公用模板(在wap目录下面新建一个base模板)，内容如下&lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt;@yield('title')&lt;/title&gt; &lt;/head&gt; &lt;body&gt; @yield('content') &lt;/body&gt; &am
laravel 2层foreach_laravel搭建博客实战的教程实例（life）
weixin_34031238的博客
12-04 223
这篇文章主要给大家介绍了关于利用laravel搭建一个迷你博客的相关资料，文中将一步步的实现步骤通过示例代码介绍的非常详细，对大家具有一定的参考学习价值，需要的朋友们下面跟着来一起学习学习吧。我的官方群点击此处。本文主要给大家介绍的是关于利用laravel搭建一个迷你博客的相关内容，分享出来供大家参考学习，下面话不多说了，来一起看看详细的介绍：一、设计与思路在开始写第一行代码之前，一定要尽量从头到...
Laravel 框架 - 模板继承
GYK0812的博客
03-13 1379
1. 父模板中用到的关键字： section -> 可以包含一些内容，这些内容页可以被子模板继承 yield -> 相当于一个占位符，在父模板中可以不定义任何内容， 如果定义了内容，子模版如果没有对应的定义，则显示父模板，如果有定义，则显示子模版 2. 子模版继承时，首行需要使用关键字 extentds 继承父模板 3. 子模版重写时，用到的关键字： 3-1. 重写section： 其中@parent为父模板中的内容 @section('header') @par..
laravel model 模型处理 修改查询 或 修改 字段时的类型格式
昊喵喵博士
12-06 7014
先了解一下此图，有助于理解  通过上图了解 这将在原有的列上添加一列is_admin,这需要通过属性访问时才会获得,如果我们希望在获得数据的时候被一起返回,则还需要append属性 class User extends Model{ //设置方法名称 protected $appends = ['is_admin','type']; //查...
通过flex实现圣杯布局
最新发布
11-19
以下是使用flex实现圣杯布局的方法： HTML代码： ```html <div class="container"> <div class="main">Main Content</div> <div class="left">Left Sidebar</div> <div class="right">Right Sidebar</div> </div> ``` CSS代码： ```css .container { display: flex; flex-wrap: wrap; justify-content: space-between; } .main { flex: 1; order: 2; } .left { flex: 0 0 200px; order: 1; } .right { flex: 0 0 200px; order: 3; } ``` 解释： 1. 将父元素设置为flex布局，并使用flex-wrap: wrap;使子元素在一行排不下时自动换行。 2. 将左右两个侧边栏的flex-basis设置为200px，使其宽度固定。 3. 将主要内容的flex-grow设置为1，使其自适应剩余空间。 4. 使用order属性调整子元素的顺序，使左侧边栏在前，主要内容在中间，右侧边栏在后。
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值