Использование CSS в представлениях Laravel?

Я только начал изучать Laravel и могу делать основы контроллера и маршрутизации.

Моя ОС - Mac OS X Lion, и она на сервере MAMP.

Мой код из 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>";
});

Это работает, представления отлично отображаются, но "тем не менее", что я хочу попробовать, это включить CSS в представлениях, я попытался добавить ссылку на таблицу стилей внутри каталога, но страница отображала ее как значение по умолчанию шрифт браузера, хотя css был в HTML!

Это index.php от предприятий в папке представлений:

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

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

Я попытался использовать механизм шаблонов Blade в моей другой папке представлений (тестирование) для отображения CSS, но снова CSS не показывался, несмотря на то, что он находится в папке тестирования!

Как я могу преодолеть эту проблему и стать лучше - поскольку я медленно изучаю эту структуру.

Ответ 1

Поместите свои ресурсы в общую папку

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

И их называли это с помощью Laravel

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

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

Ответ 2

Поместите свои ресурсы в общую папку

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

И затем вызвал его с помощью 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

(ИЛИ)

{{ 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

Ответ 3

ваш файл css принадлежит к общей папке или вложенной папке.

f.e, если вы поместите свой css в

public/css/common.css

вы бы использовали

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

В вашем обзоре...

Или вы также можете использовать класс Asset http://laravel.com/docs/views/assets...

Ответ 4

Вы также можете написать простой тег ссылки, как обычно, и затем использовать href attr:

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

конечно, вам нужно поставить файл css под public/css

Ответ 5

Мы можем сделать это следующим образом.

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

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

Он будет искать файл стиля в общей папке Laravel и затем отобразит его.

Ответ 6

Как упоминал Ахмад Шариф, вы можете связать таблицу стилей над http

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

но если вы используете https, тогда запрос будет заблокирован и придет смешанная ошибка содержимого, чтобы использовать его поверх https, используйте secure_asset, например

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

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

Ответ 7

Так как Laravel 5 класс HTML больше не включен по умолчанию.

Если вы используете помощники формы или HTML, вы увидите сообщение об ошибке, в котором не указан класс "Форма" или не найден класс "Html". Помощники формы и HTML устарели в Laravel 5.0; однако существуют замены, связанные с сообществом, такие как те, которые поддерживаются коллективом Laravel.

Вы можете использовать следующую строку, чтобы включить ваши файлы CSS или JS:

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

Ответ 8

Это невозможно, Laravel предполагает, что все находится в общей папке.

Итак, мое предложение:

  • Перейдите в общедоступную папку.
  • Создайте папку, предпочтительно названную css.
  • Создайте папку для соответствующих просмотров, чтобы сделать вещи организованными.
  • Поместите соответствующие css внутри этих папок, это будет проще для вас.

или

Если вы действительно настаиваете на том, чтобы поместить css внутри папки представлений, вы можете попробовать создать Symlink (вы - mac, так что это нормально, но для Windows это будет работать только для Vista, Server 2008 или выше) из каталога css-папки в общую папку, и вы можете использовать {{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);

Если вы действительно хотите попробовать свои идеи, попробуйте следующее:

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

Но это не сработает, даже если каталог файлов верен, потому что Laravel не сделает этого в целях безопасности, Laravel очень вас любит.

Ответ 9

поместите свой файл css в общую папку. (Публичный/CSS/самозагрузка-responsive.css) и <link href="./css/bootstrap-responsive.css" rel="stylesheet">

Ответ 10

Скопируйте файл css или js, который вы хотите включить, в общую папку или вы можете захотеть сохранить их в папках public/css или public/js.

Eg. вы используете файл style.css из папки css в общедоступном каталоге, тогда вы можете использовать

<link rel="stylesheet" href="{{ url() }}./css/style.css" type="text/css"/>

Но в Laravel 5.2 вам нужно будет использовать

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

и если вы хотите включить файлы javascript из общедоступной/js-папки, это тоже довольно просто.

<script src="{{ url() }}./js/jquery.min.js"></script>

и в Laravel 5.2 вам нужно будет использовать

<script src="{{ url('/') }}./js/jquery.min.js"></script>

функция url() является вспомогательной функцией laravel, которая генерирует полный URL-адрес для заданного пути.

Ответ 11

Обновление для laravel 5.4 ----

Все ответы использовали класс HTML для laravel, но я предполагаю, что он теперь обесценился в laravel 5.4, поэтому Поместите свои файлы css и js в public- > css/js И ссылайтесь на них в своем html, используя

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

Ответ 12

Для Laravel 5.4 и если вы используете помощник микса, используйте

    <link href="{{ mix('/css/app.css') }}" rel="stylesheet">
    <script src="{{ mix('/js/app.js') }}"></script>

Ответ 13

Поместите их в папку public и вызовите его в представлении с чем-то вроде href="{{ asset('public/css/style.css') }}". Обратите внимание, что public должен быть включен при вызове активов.

Ответ 14

поместите ваш css в общую папку, затем

добавьте это в свой файл клика

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

Ответ 15

На мой взгляд, лучший способ маршрутизации на css и js использует следующий код:

<link rel="stylesheet" type="text/css" href="{{ URL::to('route/to/css') }}">

Итак, если у вас есть css файл с именем main.css внутри папки css в общей папке, он должен быть следующим:

<link rel="stylesheet" type="text/css" href="{{ URL::to('css/main.css') }}">