_Layout.cshtml 파일에서 .css 파일을 설정하는 방법을 알고 있지만 뷰별로 스타일 시트를 적용하는 것은 어떻습니까?
내 생각은 _Layout.cshtml에는 <head>태그가 있지만 레이아웃이 아닌 뷰 중 하나에서는 작동하지 않는다는 것입니다. 어디 않는 <link>태그 이동?
_Layout.cshtml 파일에서 .css 파일을 설정하는 방법을 알고 있지만 뷰별로 스타일 시트를 적용하는 것은 어떻습니까?
내 생각은 _Layout.cshtml에는 <head>태그가 있지만 레이아웃이 아닌 뷰 중 하나에서는 작동하지 않는다는 것입니다. 어디 않는 <link>태그 이동?
답변:
전체 사이트에서 재사용되는 CSS <head>의 경우 _Layout다음 섹션 에서 CSS를 정의합니다 .
<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는이 마스터 페이지를 사용하는 뷰에서 섹션이 필요하지 않음을 의미하며 뷰 엔진은 정의 된 "스타일"섹션이 없다는 사실을 행복하게 무시합니다. 당신의 관점에서. true 인 경우, "스타일"섹션이 정의되어 있지 않으면 뷰가 렌더링되지 않고 오류가 발생합니다.
RenderSection헤더의 끝이 아닌 (놀랍게도 :) 전화하는 곳에서 렌더링됩니다 .
나는 다음과 같이 블록을 추가하려고 시도했다.
@section styles{
<link rel="Stylesheet" href="@Href("~/Content/MyStyles.css")" />
}
_Layout.cshtml 파일의 해당 블록 :
<head>
<title>@ViewBag.Title</title>
@RenderSection("styles", false);
</head>
어느 작품! 그러나 나는 도울 수는 없지만 더 좋은 방법이 있다고 생각합니다. 업데이트 : @RenderSection문 에 "false" 가 추가되어 @section호출 된 추가를 무시해도 뷰가 흔들리지 않습니다 head.
"Head".
@RenderSection(). 잘 잡았습니다.
사용
@Scripts.Render("~/scripts/myScript.js")또는
@Styles.Render("~/styles/myStylesheet.css")당신을 위해 일할 수 있습니다.
레이아웃은 마스터 페이지와 동일하게 작동합니다. 레이아웃에있는 CSS 참조, 모든 하위 페이지에 있습니다.
이 구조는 Layout.cshtml 파일에서 할 수 있습니다
<link href="~/YourCssFolder/YourCssStyle.css" rel="stylesheet" type="text/css" />