asp.net-mvc 如何在 CSHTML 文件中引用 CSS?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/14600087/
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
how to refere CSS in CSHTML file?
提问by user1802212
How can I apply/put external or extra <script>references and CSS <link>in my Razor content/child pages?
如何在 Razor 内容/子页面中应用/放置外部或额外<script>引用和 CSS <link>?
@model Portal.Common.Models.TempModel
@{
ViewBag.Title = "asdasd";
ViewBag.MissionId = id;
ViewBag.id = 0;
Layout = "~/Views/Shared/_Layout.cshtml";
}
@if (false)
{
<script src="../../Scripts/jquery-1.7.1-vsdoc.js" type="text/javascript"></script>
<link href="../../Content/Site.css" rel="stylesheet" type="text/css" />
<script src="...../ui/jquery.ui.mouse.js"></script>
<script src="...../ui/jquery.ui.draggable.js"></script>
}
<style type="text/css">
img[src*="iws3.png"] {
display: none;
}
@section JavaScript {
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript"></script> "
回答by Darin Dimitrov
In your _Layout you could have 2 sections: one for the scripts and one for the styles:
在您的 _Layout 中,您可以有 2 个部分:一个用于脚本,另一个用于样式:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>@ViewBag.Title</title>
@RenderSection("Styles", false)
</script>
</head>
<body>
@RenderBody()
@RenderSection("Scripts", false)
</body>
</html>
and then in your view override the sections you want:
然后在您的视图中覆盖您想要的部分:
@model Portal.Common.Models.TempModel
@{
ViewBag.Title = "asdasd";
ViewBag.MissionId = id;
ViewBag.id = 0;
Layout = "~/Views/Shared/_Layout.cshtml";
}
@section Styles {
<!-- main CSS -->
<link href="@Url.Content("~/Content/Site.css)" rel="stylesheet" type="text/css" />
<!-- some external CSS -->
<link href="http://www.example.com/foo.css" rel="stylesheet" type="text/css" />
<!-- some inline CSS -->
<style type="text/css">
img[src*="iws3.png"] {
display: none;
}
</style>
}
@section Scripts {
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script src="@Url.Content("~/ui/jquery.ui.mouse.js")></script>
<script src="@Url.Content("~/ui/jquery.ui.draggable.js")></script>
<script type="text/javascript">
// some inline javascript
</script>
}
回答by Soumitra
Another way, It's useful while same css and script files are referenced from different cshtml files and you are not using a default layout. Create a partial view(let _Reference.cshtml) in shared folder and add the following for raw output :
另一种方式,当从不同的 cshtml 文件引用相同的 css 和脚本文件并且您没有使用默认布局时,它很有用。在共享文件夹中创建一个局部视图(让 _Reference.cshtml)并为原始输出添加以下内容:
@Html.Raw("<link href='../../Content/Site.css' rel='stylesheet'>")
.....
@Html.Raw("<script src='../../Scripts/jquery-1.5.1.min.js'></script>")
Now in the head tag of your referencing cshtml, add this :
现在在引用 cshtml 的 head 标记中,添加以下内容:
<head>
<title>MVC Test</title>
@Html.Partial("_Reference")
</head>
Hope this will help someone.
希望这会帮助某人。

