Як посилатися на .css-файл на вигляд бритви?

196

Я знаю, як встановити .css файли на файл _Layout.cshtml, але як бути із застосуванням таблиці стилів за ознакою перегляду?

Думаю, що в _Layout.cshtml у вас є <head>теги, з якими можна працювати, але це не так, як в одному з ваших непроглядових поглядів. Куди поділяються <link>теги?

css asp.net-mvc razor

— MrBoJangles
джерело

340

Для CSS, які повторно використовуються на всьому сайті, я визначаю їх у <head>розділі _Layout:

<head>
    <link href="@Url.Content("~/Styles/main.css")" rel="stylesheet" type="text/css" />
    @RenderSection("Styles", false)
</head>

і якщо мені потрібні певні стилі перегляду, я визначаю Stylesрозділ у кожному перегляді:

@section Styles {
    <link href="@Url.Content("~/Styles/view_specific_style.css")" rel="stylesheet" type="text/css" />
}

Редагувати: корисно знати, що другий параметр у @RenderSection, false, означає, що розділ не потрібен для представлення даних, на якому використовується ця головна сторінка, і механізм перегляду буде блаженно ігнорувати факт відсутності розділу "Стилі" на ваш погляд. Якщо це правда, представлення не відображатиметься, і помилка буде видана, якщо не буде визначено розділ "Стилі".

— Дарин Димитров
джерело

4

Знаєте, по-друге, це не так вже й погано. Я думаю, що це просто нове та інше.

— MrBoJangles

@section Styles -> каже, що не може вирішити розділ Стилі, що це означає?

— Ревіз

2

@Sam, це означає, що у вашому макеті не визначений такий розділ.

— Дарин Димитров

@DarinDimitrov Чи існує спосіб відображення в точному положенні, а не в кінці заголовка. Я хотів би дотримуватися конкретного порядку для пріоритетів css.

— Марк

@Marc Це зроблено на місці, куди ви дзвоните RenderSection(на диво :), а не в кінці заголовка.

— Девід Ференчі Рогожан

22

Я спробував додати блок так:

@section styles{
    <link rel="Stylesheet" href="@Href("~/Content/MyStyles.css")" />
}

І відповідний блок у файлі _Layout.cshtml:

<head>
<title>@ViewBag.Title</title>
@RenderSection("styles", false);
</head>

Який працює! Але я не можу допомогти, але думаю, що є кращий спосіб. UPDATE: долучення «брехня» в @RenderSectionзаяві , так що ваш погляд не буде «Splode , коли ви нехтуєте додати @sectionназиваються head.

— MrBoJangles
джерело

Немає кращого способу, хоча я б назвав цей розділ "Head".

— СЛАкс

Ви абсолютно праві. Називаючи це "pageStyle" говорить про те, що це лише для цієї мети.

— MrBoJangles

1

Якщо ви зробите це так, вам потрібно буде додати "MyStyles" у всі перегляди, я б пішов з відповіддю Даріна.

— Філіп Екберг

Право-о. Тому я додав помилковий аргумент до @RenderSection(). Хороший улов.

— MrBoJangles

12

Використання

@Scripts.Render("~/scripts/myScript.js")

або

@Styles.Render("~/styles/myStylesheet.css")

може працювати для вас.

https://stackoverflow.com/a/36157950/2924015

— Нішант Шаан
джерело

4

Будь ласка, не публікуйте посилання, щоб повторити відповіді . Натомість розгляньте інші дії, які можуть допомогти майбутнім користувачам знайти відповідь, яка їм потрібна, як описано у пов’язаному дописі.

— Могсдад

3

макет працює так само, як і головна сторінка. будь-яка посилання на css, яку має верстка, матиме будь-які дочірні сторінки.

Скотт Гу має тут чудове пояснення

— BentOnCoding
джерело

1

Дуже вдячний. Однак моє запитання полягає в тому, як мені встановити посилання на єдиний погляд, а не на "головний".

— MrBoJangles

1

Я вважаю за краще використовувати помічник html-версії від dll Client Dependency

Html.RequireCss("yourfile", 9999); // 9999 is loading priority

— Джон Блер
джерело

0

Ви можете використовувати цю структуру у файлі Layout.cshtml

<link href="~/YourCssFolder/YourCssStyle.css" rel="stylesheet" type="text/css" />

— мофідул
джерело

1

Як це дозволяє мені вибірково застосовувати таблицю стилів до перегляду?

— MrBoJangles

Ви також можете додати клас або ідентифікатор до кожного розділу, а всередині заголовка у вас можуть бути такі стилі, як той, який згадав mofidul. Що я роблю, це я працюю з sass, тому кожен вид має окремий контейнер класу. Таким чином я створив сторінки для sass для кожного розділу, який врешті-решт є більш структурованим та організованим.

— Лев

яке значення rel = "таблиця стилів"?

— Свен Краутер