在刀片模板中包含 css 文件? [英] Including a css file in a blade template?

查看:30
本文介绍了在刀片模板中包含 css 文件?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想在我的 Laravel 刀片模板中包含一个 css 文件.

I want to include a css file in my Laravel blade template.

我试过了:

@include(public_path('css/styles.css'))

但它说视图不存在.它确实存在.

But it says view does not exist. It does exist.

如何包含 css 文件?

How can I include a css file?

请注意,我知道这不是链接 css 文件的正确方法,但对于我的用例来说是(我不是在构建网站).

Please note, I know this is not the correct way to link css files, but for my use case it is (I'm not building a website).

推荐答案

@include 指令允许您从另一个视图中包含 Blade 视图,如下所示:

@include directive allows you to include a Blade view from within another view, like this :

@include('another.view')


从主布局中包含 CSS 或 JS

asset()

asset 函数使用请求的当前方案(HTTP 或 HTTPS)为资产生成 URL:


Include CSS or JS from master layout

asset()

The asset function generates a URL for an asset using the current scheme of the request (HTTP or HTTPS):

<link href="{{ asset('css/styles.css') }}" rel="stylesheet">
<script type="text/javascript" src="{{ asset('js/scripts.js') }}"></script>

mix()

如果您使用的是版本化的 Mix 文件,您也可以使用 mix()功能.它将返回版本化 Mix 文件的路径:

mix()

If you are using versioned Mix file, you can also use mix() function. It will returns the path to a versioned Mix file:

<link href="{{ mix('css/styles.css') }}" rel="stylesheet">
<script type="text/javascript" src="{{ mix('js/scripts.js') }}"></script>


从子视图引入 CSS 或 JS,使用 @push().

layout.blade.php


Incude CSS or JS from sub-view, use @push().

layout.blade.php

<html>
    <head>
        <!-- push target to head -->
        @stack('styles')
        @stack('scripts')
    </head>
    <body>

        <!-- or push target to footer -->
        @stack('scripts')
    </body>
</html

view.blade.php

view.blade.php

@push('styles')
    <link href="{{ asset('css/styles.css') }}" rel="stylesheet">
@endpush

@push('scripts')
    <script type="text/javascript" src="{{ asset('js/scripts.js') }}"></script>
@endpush

这篇关于在刀片模板中包含 css 文件?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆