Menu
Use the rel attribute only when the href attribute is present. type – determines the content of the linked file or document between the <style> and </style> tags. It has a text or css as the default value. href – specifies the location of the CSS file you want to link to the HTML.
razor. css file is a scoped CSS file. For an Example component in an Example. razor file, create a file alongside the component named Example.
For CSS that are reused among the entire site I define them in the <head> section of the _Layout:
<head>
<link href="@Url.Content("~/Styles/main.css")" rel="stylesheet" type="text/css" />
@RenderSection("Styles", false)
</head>
and if I need some view specific styles I define the Styles section in each view:
@section Styles {
<link href="@Url.Content("~/Styles/view_specific_style.css")" rel="stylesheet" type="text/css" />
}
Edit: It's useful to know that the second parameter in @RenderSection, false, means that the section is not required on a view that uses this master page, and the view engine will blissfully ignore the fact that there is no "Styles" section defined in your view. If true, the view won't render and an error will be thrown unless the "Styles" section has been defined.
I tried adding a block like so:
@section styles{
<link rel="Stylesheet" href="@Href("~/Content/MyStyles.css")" />
}
And a corresponding block in the _Layout.cshtml file:
<head>
<title>@ViewBag.Title</title>
@RenderSection("styles", false);
</head>
Which works! But I can't help but think there's a better way. UPDATE: Added "false" in the @RenderSection statement so your view won't 'splode when you neglect to add a @section called head.
Using
@Scripts.Render("~/scripts/myScript.js")
or
@Styles.Render("~/styles/myStylesheet.css")
could work for you.
https://stackoverflow.com/a/36157950/2924015
layout works the same as an master page. any css reference that layout has, any child pages will have.
Scott Gu has an excellent explanation here
I prefer to use the razor html helper from Client Dependency dll
Html.RequireCss("yourfile", 9999); // 9999 is loading priority
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With