php 在 Laravel 视图中使用 CSS?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/13433683/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-25 05:25:15  来源:igfitidea点击:

Using CSS in Laravel views?

phpframeworkslaravel

提问by avenas8808

I've just began learning Laravel, and can do the basics of a controller and routing.

我刚开始学习 Laravel,可以做控制器和路由的基础知识。

My OS is Mac OS X Lion, and it's on a MAMP server.

我的操作系统是 Mac OS X Lion,它在 MAMP 服务器上。

My code from routes.php:

我来自 routes.php 的代码:

Route::get('/', function() {
    return View::make('home.index');
});

Route::get('businesses', function() {
    return View::make('businesses.index');
});

Route::get('testing', function() {
    return View::make('testing.index');
});        

Route::get('hello', function() {
    return "<h3>Hello world!</H3>";
});

That works, the views display perfectly, ''however'' what I want to try and do is include CSS within the views, I tried adding in a link to a stylesheet within the directory but the page displayed it as the default browser font even though the css was in the HTML!

这有效,视图显示完美,“但是”我想要尝试和做的是在视图中包含 CSS,我尝试添加到目录中样式表的链接,但页面将其显示为默认浏览器字体甚至虽然 css 在 HTML 中!

This is index.php from businesses within the views folder:

这是来自 views 文件夹中企业的 index.php:

<head>
   <link rel="stylesheet" type="text/css" href="mystyle.css">
</head>

<p>Business is a varied term. My content here.

I tried using the Blade template engine in my other views folder (testing) to display CSS but again the CSS did not show despite it being in the testing folder!

我尝试在我的其他视图文件夹(测试)中使用 Blade 模板引擎来显示 CSS,但是尽管 CSS 位于测试文件夹中,但还是没有显示!

How can I overcome this problem, and get better - as I'm slowly learning this framework.

我怎样才能克服这个问题并变得更好 - 因为我正在慢慢学习这个框架。

回答by Fernando Montoya

Put your assets in the public folder

将您的资产放在公共文件夹中

public/css
public/images
public/fonts
public/js

And them called it using Laravel

他们使用 Laravel 调用它

{{ HTML::script('js/scrollTo.js'); }}

{{ HTML::style('css/css.css'); }}

回答by Lead Developer

Put your assets in the public folder

将您的资产放在公共文件夹中

public/css
public/images
public/fonts
public/js

And then called it using Laravel

然后使用 Laravel 调用它

{{ URL::asset('js/scrollTo.js'); }} // Generates the path to public directory public/js/scrollTo.js

{{ URL::asset('css/css.css'); }}   // Generates the  path to public directory public/css/css.css

(OR)

(或者)

{{ HTML::script('js/scrollTo.js'); }} // Generates the  path to public directory public/js/scrollTo.js

{{ HTML::style('css/css.css'); }} // Generates the path to public directory public/css/css.css

回答by André Keller

your css file belongs into the public folder or a subfolder of it.

您的 css 文件属于公共文件夹或其子文件夹。

f.e if you put your css in

fe 如果你把你的 css 放进去

public/css/common.css

you would use

你会用

HTML::style('css/common.css');

In your blade view...

在您的刀片视图中...

Or you could also use the Asset class http://laravel.com/docs/views/assets...

或者您也可以使用资产类http://laravel.com/docs/views/assets...

回答by Diego Casta?o

You can also write a simple link tag as you normaly would and then on the href attr use:

您还可以像往常一样编写一个简单的链接标签,然后在 href attr 上使用:

<link rel="stylesheet" href="<?php echo asset('css/common.css')?>" type="text/css"> 

of course you need to put your css file under public/css

当然你需要把你的css文件放在public/css下

回答by Ahmad Sharif

We can do this by the following way.

我们可以通过以下方式做到这一点。

<link href="{{ asset('/css/style.css') }}" rel="stylesheet">

{{ HTML::style('css/style.css', array('media' => 'print')) }}

It will search the style file in the public folder of Laravel and then will render it.

它将搜索 Laravel 公共文件夹中的样式文件,然后将其渲染。

回答by Sambhav Pandey

Like Ahmad Sharif mentioned, you can link stylesheet over http

就像 Ahmad Sharif 提到的,你可以链接样式表 http

<link href="{{ asset('/css/style.css') }}" rel="stylesheet"> 

but if you are using httpsthen the request will be blocked and a mixed content error will come, to use it over https use secure_assetlike

但是如果您正在使用,https那么请求将被阻止并且会出现混合内容错误,要通过 https 使用它,请使用secure_asset类似

<link href="{{ secure_asset('/css/style.css') }}" rel="stylesheet">

https://laravel.com/docs/5.1/helpers#method-secure-asset

https://laravel.com/docs/5.1/helpers#method-secure-asset

回答by Bono

Since Laravel 5 the HTMLclass is not included by default anymore.

从 Laravel 5 开始HTML,默认情况下不再包含该类。

If you're using Form or HTML helpers, you will see an error stating class 'Form' not found or class 'Html' not found. The Form and HTML helpers have been deprecated in Laravel 5.0; however, there are community-driven replacements such as those maintained by the Laravel Collective.

如果您正在使用 Form 或 HTML 帮助程序,您将看到一个错误,指出找不到类“表单”或找不到类“Html”。表单和 HTML 助手在 Laravel 5.0 中已被弃用;但是,也有社区驱动的替代品,例如 Laravel 集体维护的替代品。

You can make use of the following line to include your CSS or JS files:

您可以使用以下行来包含您的 CSS 或 JS 文件:

<link href="{{ URL::asset('css/base.css') }}" rel="stylesheet">
<link href="{{ URL::asset('js/project.js') }}" rel="script">

回答by Eminem347

Update for laravel 5.4 ----

Laravel 5.4 更新 ----

All answers have have used the HTML class for laravel but I guess it has been depreciated now in laravel 5.4, so Put your css and js files in public->css/js And reference them in your html using

所有答案都使用了 laravel 的 HTML 类,但我想它现在在 laravel 5.4 中已经贬值了,所以将你的 css 和 js 文件放在 public->css/js 中,并在你的 html 中使用引用它们

<link href="css/css.common.css" rel="stylesheet" >

回答by Bryan P

That is not possible bro, Laravel assumes everything is in public folder.

这是不可能的兄弟,Laravel 假设所有内容都在公共文件夹中。

So my suggestion is:

所以我的建议是:

  1. Go to the publicfolder.
  2. Create a folder, preferably named css.
  3. Create the folder for the respective views to make things organized.
  4. Put the respective css inside of those folders, that would be easier for you.
  1. 转至公共文件夹。
  2. 创建一个文件夹,最好命名为css
  3. 为各个视图创建文件夹以使事情井井有条。
  4. 将相应的 css 放在这些文件夹中,这对您来说会更容易。

Or

或者

If you really insist to put css inside of views folder, you could try creating Symlink(you're mac so it's ok, but for windows, this will only work for Vista, Server 2008 or greater) from your css folder directory to the public folder and you can use {{HTML::style('your_view_folder/myStyle.css')}}inside of your view files, here's a code for your convenience, in the code you posted, put these before the return View::make():

如果你真的坚持将 css 放在 views 文件夹中,你可以尝试从你的 css 文件夹目录中创建Symlink(你是 mac 所以没关系,但对于 Windows,这仅适用于 Vista、Server 2008 或更高版本)到公共文件夹,您可以{{HTML::style('your_view_folder/myStyle.css')}}在视图文件中使用,为了您的方便,这里有一个代码,在您发布的代码中,将这些放在return View::make()

$css_file = 'myStyle.css';
$folder_name = 'your_view_folder';
$view_path = app_path() . '/views/' . $folder_name . '/' . $css_file;
$public_css_path = public_path() . '/' . $folder_name;
if(file_exists($public_css_path)) exec('rm -rf ' . $public_css_path);
exec('mkdir ' . $public_css_path);
exec('ln -s ' . $view_path .' ' . $public_css_path . '/' . $css_file);

If you really want to try doing your idea, try this:

如果你真的想尝试实现你的想法,试试这个:

<link rel="stylesheet" href="<?php echo app_path() . 'views/your_view_folder/myStyle.css'?>" type="text/css">

But it won't work even if the file directory is correct because Laravel won't do that for security purposes, Laravel loves you that much.

但是即使文件目录正确它也不会工作,因为出于安全考虑,Laravel 不会这样做,Laravel 非常爱你。

回答by huuthang

put your css File in public folder . (public/css/bootstrap-responsive.css) and <link href="./css/bootstrap-responsive.css" rel="stylesheet">

将您的 css 文件放在 public 文件夹中。(public/css/bootstrap-responsive.css) 和<link href="./css/bootstrap-responsive.css" rel="stylesheet">