रेजर दृश्य पर एक .css फ़ाइल का संदर्भ कैसे दें?

195

मुझे पता है कि _Layout.cshtml फ़ाइल पर .css फ़ाइलों को कैसे सेट किया जाए, लेकिन प्रति-दृश्य आधार पर एक स्टाइलशीट लागू करने के बारे में क्या?

यहाँ मेरी सोच यह है कि, _Layout.cshtml में, आपके पास <head>काम करने के लिए टैग हैं, लेकिन आपके गैर-लेआउट विचारों में से एक में ऐसा नहीं है। <link>टैग कहां जाते हैं?

css asp.net-mvc razor

— MrBoJangles
स्रोत

339

सीएसएस के लिए जो पूरी साइट के बीच पुन: उपयोग किए जाते हैं, मैं उन्हें निम्नलिखित के <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" />
}

संपादित करें: यह जानना उपयोगी है कि @ पैरामीटर में दूसरा पैरामीटर, गलत, का अर्थ है कि इस मास्टर पृष्ठ का उपयोग करने वाले दृश्य पर अनुभाग की आवश्यकता नहीं है, और दृश्य इंजन इस तथ्य की उपेक्षा करेगा कि कोई "शैलियाँ" खंड परिभाषित नहीं है आपके विचार में। यदि सही है, तो दृश्य रेंडर नहीं होगा और जब तक "स्टाइल्स" खंड को परिभाषित नहीं किया जाएगा, तब एक त्रुटि होगी।

— डारिन दिमित्रोव
स्रोत

4

तुम्हें पता है, दूसरे विचार पर, यह इतना बुरा नहीं है। मुझे लगता है कि यह सिर्फ नया और अलग है।

— MrBoJangles

@ स्टाईल स्टाइल्स -> सेक्शन स्टाइल्स को हल नहीं कर सकता, इसका क्या मतलब है?

— स्पष्ट

2

@ नमस्कार, इसका मतलब है कि आपके लेआउट में ऐसा कोई खंड परिभाषित नहीं है।

— डारिन दिमित्रोव

@DarinDimitrov हेडर के अंत में के बजाय सटीक स्थिति में प्रस्तुत करने का एक तरीका है। मैं सीएसएस प्राथमिकताओं के लिए एक विशिष्ट आदेश रखना चाहूंगा।

— मार्क

@Marc यह एक जगह पर प्रदान किया जाता है, जहाँ आप कॉल करते हैं RenderSection(आश्चर्यजनक रूप से :), हेडर के अंत में नहीं।

— डेविड फेरेंस्की रोगोजान

22

मैंने ऐसा ब्लॉक जोड़ने की कोशिश की:

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

और _Layout.cshtml फ़ाइल में एक संबंधित ब्लॉक:

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

जो काम करता है! लेकिन मैं मदद नहीं कर सकता, लेकिन लगता है कि एक बेहतर तरीका है। अद्यतन: में "झूठे" जोड़ा गया @RenderSectionबयान तो आपके विचार नहीं किया जाएगा 'Splode जब आप एक जोड़ने के लिए उपेक्षा @sectionकहा जाता है head।

— MrBoJangles
स्रोत

वहाँ एक बेहतर तरीका नहीं है, हालांकि मैं अनुभाग का नाम दूंगा "Head"।

— SLACs

आप बिलकुल सही कह रहे हैं। इसे "पेजसाइल" कहते हुए पता चलता है कि यह केवल उसी उद्देश्य के लिए है।

— MrBoJangles

1

यदि आप इसे इस तरह करते हैं, तो आपको सभी दृश्यों में "MyStyles" जोड़ने की आवश्यकता होगी, मैं डारिन्स उत्तर के साथ जाऊंगा।

— फिलिप एकबर्ग

राइट-ओ। इसलिए मैंने गलत तर्क जोड़ा @RenderSection()। अच्छी पकड़।

— MrBoJangles

12

का उपयोग करते हुए

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

या

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

आपके लिए काम कर सकता है।

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

— निशांत शान
स्रोत

4

कृपया डुप्लिकेट उत्तरों के लिंक पोस्ट न करें । इसके बजाय, अन्य कार्यों पर विचार करें जो भविष्य के उपयोगकर्ताओं को उनकी ज़रूरत का जवाब खोजने में मदद कर सकते हैं, जैसा कि लिंक किए गए पोस्ट में वर्णित है।

— मोगादाद

3

लेआउट एक मास्टर पृष्ठ के समान काम करता है। किसी भी css का सन्दर्भ जो लेआउट में है, किसी भी चाइल्ड पेज में होगा।

स्कॉट गु की यहाँ एक उत्कृष्ट व्याख्या है

— BentOnCoding
स्रोत

1

बहुत आभारी। हालांकि, मेरा सवाल यह है कि मैं किसी एक दृश्य का संदर्भ कैसे निर्धारित करूं, न कि "मास्टर"।

— MrBoJangles

1

मैं क्लाइंट डिपेंडेंसी dll से रेजर HTML हेल्पर का उपयोग करना पसंद करता हूं

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

— जॉन ब्लेयर
स्रोत

0

आप इस संरचना को Layout.cshtml फ़ाइल में कर सकते हैं

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

— mofidul
स्रोत

1

यह मुझे प्रति दृश्य शैली शीट का चयन करने की अनुमति कैसे देता है?

— MrBoJangles

आप प्रत्येक सेक्शन में एक वर्ग या आईडी भी जोड़ सकते हैं, और हेडर के अंदर आप एक शैलियों की तरह हो सकते हैं जो कि मोफिदुल द्वारा उल्लिखित है। मैं क्या करूं मैं सैस के साथ काम कर रहा हूं, इसलिए प्रत्येक दृश्य में एक अलग वर्ग कंटेनर है। इस तरह मैंने प्रत्येक अनुभाग के लिए सैस पेज बनाए, जो अंत में अधिक संरचित और व्यवस्थित है।

— लियो

rel = "स्टाइलशीट" का क्या अर्थ है?

— स्वेन क्राउटर