วิธีการอ้างอิงไฟล์. 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 -> พูดว่าไม่สามารถแก้ไขสไตล์ของส่วนได้หมายความว่าอย่างไร

— Revious

2

@ แซมมันหมายความว่าไม่มีส่วนดังกล่าวที่กำหนดไว้ในเค้าโครงของคุณ

— ดารินทร์ดิมิทรอฟ

@DarinDimitrov มีวิธีการแสดงผลที่ตำแหน่งที่แน่นอนแทนที่จะเป็นที่ส่วนท้ายของส่วนหัว ฉันต้องการเก็บคำสั่งซื้อเฉพาะสำหรับลำดับความสำคัญของ CSS

— Marc

@ Marc มันแสดงผลในสถานที่ที่คุณโทรหาRenderSection(น่าแปลกใจ :) ไม่ใช่ที่ส่วนท้ายของส่วนหัว

— David Ferenczy Rogožan

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 เมื่อคุณละเลยที่จะเพิ่มที่เรียกว่า@sectionhead

— MrBoJangles
แหล่งที่มา

"Head"ไม่มีวิธีที่ดีกว่าถึงแม้ว่าฉันจะชื่อส่วน

— SLaks

คุณพูดถูก การเรียกมันว่า "pageStyle" แสดงให้เห็นว่ามันมีไว้สำหรับวัตถุประสงค์นั้นเท่านั้น

— MrBoJangles

1

หากคุณทำเช่นนี้คุณจะต้องเพิ่ม "MyStyles" ในทุกการดูฉันจะตอบด้วย Darins

— Filip Ekberg

ขวา o @RenderSection()นั่นเป็นเหตุผลที่ผมเพิ่มอาร์กิวเมนต์เท็จ จับดี.

— MrBoJangles

12

การใช้

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

หรือ

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

สามารถใช้ได้สำหรับคุณ

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

— Nishanth Shaan
แหล่งที่มา

4

กรุณาอย่าโพสต์ลิงก์ไปซ้ำคำตอบ ให้พิจารณาการกระทำอื่นที่อาจช่วยให้ผู้ใช้ในอนาคตค้นหาคำตอบที่ต้องการดังอธิบายในโพสต์ที่ลิงก์

— Mogsdad

3

เลย์เอาต์ทำงานเหมือนกับมาสเตอร์เพจ การอ้างอิง CSS ใด ๆ ที่มีรูปแบบหน้าลูก ๆ จะมี

Scott Gu มีคำอธิบายที่ยอดเยี่ยมที่นี่

— BentOnCoding
แหล่งที่มา

1

จำเป็นมาก อย่างไรก็ตามคำถามของฉันคือฉันจะตั้งค่าการอ้างอิงไปยังมุมมองเดียวได้อย่างไรไม่ใช่ "ต้นแบบ"

— MrBoJangles

1

ฉันชอบใช้มีดโกนผู้ช่วย html จาก Client Dependency dll

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

— จอห์นแบลร์
แหล่งที่มา

0

คุณสามารถโครงสร้างนี้ในไฟล์ Layout.cshtml

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

— mofidul
แหล่งที่มา

1

สิ่งนี้ทำให้ฉันเลือกสไตล์ชีทต่อการดูได้อย่างไร

— MrBoJangles

นอกจากนี้คุณยังสามารถเพิ่มคลาสหรือรหัสให้กับแต่ละส่วนและภายในส่วนหัวคุณสามารถมีสไตล์เหมือนที่กล่าวถึงโดย mofidul สิ่งที่ฉันทำคือฉันทำงานกับ sass ดังนั้นแต่ละมุมมองจะมีคลาสแยกต่างหาก ด้วยวิธีนี้ฉันสร้างหน้า sass สำหรับแต่ละส่วนซึ่งในท้ายที่สุดมีโครงสร้างและจัดระเบียบมากขึ้น

— Leo

rel = "stylesheet" หมายถึงอะไร?

— Sven Krauter