Question

我知道如何在_Layout.cshtml文件中设置.css文件，但是基于每个视图应用样式表呢？

我的想法是，在_Layout.cshtml中，您可以使用<head>个标签，但在其中一个非布局视图中却不是这样。 <link>标记在哪里？

Answer 1

对于在整个网站中重复使用的CSS，我在<head>的{{1}}部分中定义了它们：

_Layout

如果我需要一些特定于视图的样式，我在每个视图中定义<head> <link href="@Url.Content("~/Styles/main.css")" rel="stylesheet" type="text/css" /> @RenderSection("Styles", false) </head>部分：

Styles

编辑：知道@RenderSection中的第二个参数false是有用的，这意味着在使用这个母版页的视图上不需要该部分，并且视图引擎会幸福地忽略没有“样式”的事实“视图中定义的部分。如果为true，则视图将不会呈现，并且除非已定义“样式”部分，否则将引发错误。

Answer 2

我尝试添加一个像这样的块：

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

_Layout.cshtml文件中的相应块：

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

哪个有效！但我不禁想到有更好的方法。更新：在@RenderSection语句中添加了“false”，这样当您忽略添加名为@section的{{1}}时，您的视图就不会发生爆炸。

Answer 3

使用

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

或

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

可能适合你。

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

Answer 4

布局与母版页的工作方式相同。布局具有的任何css引用，任何子页面都将具有。

Scott Gu has an excellent explanation here

Answer 5

我更喜欢使用Client Dependency dll中的razor html helper

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

Answer 6

您可以在Layout.cshtml文件中使用此结构

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

如何在剃刀视图上引用.css文件？

6 个答案: