gpt4 book ai didi

html - 使用相同的 Laravel 布局时的不同背景图像

转载 作者:可可西里 更新时间:2023-11-01 13:10:25 26 4
gpt4 key购买 nike

我的 laravel 应用程序有一个布局。我有四个扩展此布局的 View 。但是,我希望每个 View 都有不同的背景图像。

我的 Layout.blade.php 文件如下所示:

<!doctype html>

<html lang="en">
<head>
<meta charset="UTF-8">
<title>TITLE</title>
<link rel="stylesheet" href="{{ asset('css/bootstrap.min.css') }}" />
<link rel="stylesheet" href="{{ asset('css/style.css') }}" />
</head>
<nav>
<!-- NAV STUFF HERE -->
</nav>
<body>

<div class="container">

@yield('content')
</div>
</body>
</html>

我在 style.css 文件中设置了我的 body 样式:

body{

background-image: url('/images/image.png');
background-size: cover;
}

这种样式化技术不言而喻地为每个 View 提供了相同的背景图像,这是我不想要的。我希望能够为每个 View 设置不同的背景图像。

那么我如何设置每个页面具有不同的背景图像,但仍保持它们扩展通用布局的功能?谢谢。

最佳答案

而不是像这样设置 body 的样式:

body{
background-image: url('/images/image.png');
background-size: cover;
}

将样式应用于您的 View 的父元素,如下所示:

.view_parent_image1{
background-image: url('/images/image1.png');
background-size: cover;
}

.view_parent_image2{
background-image: url('/images/image2.png');
background-size: cover;
}

然后像这样使用它:

// View 1
@extends('layouts.master')

@section('content')
<div class='view_parent_image1'>

</div>
@stop

在另一个 View 中使用类 view_parent_image2 代替等等:

    // View 2
@extends('layouts.master')

@section('content')
<div class='view_parent_image2'>

</div>
@stop

更新:另一种方法:

// In your master layout
<body class='{{ $bodyClass or "default" }}'>

加载 View 时:

return View::make('viewname')->with('bodyClass', 'imageOne');

CSS:

.default { ... }
.imageOne { ... }

您还可以从 BaseController 共享一个全局变量:

View::share('bodyClass', 'imageOne');

最后(也许是最好的)您可以创建 View 编辑器来自动设置 View 的:

View::composers(array(
'ViewComposers@homeViewComposer' => 'home.index',
'ViewComposers@aboutViewComposer' => 'about.index',
));

class ViewComposers {
public function homeViewComposer($view)
{
return $view->with('bodyClass', 'homeViewClass');
}

public function aboutViewComposer($view)
{
return $view->with('bodyClass', 'aboutViewClass');
}
}

CSS

.homeViewClass { ... }
.aboutViewClass{ ... }

如果您需要有关如何创建和放置 view composers 的详细信息,那么您可以 follow this answer .

关于html - 使用相同的 Laravel 布局时的不同背景图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23984588/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com