Bir jilet görünümünde bir .css dosyasına nasıl başvurulur?

196

_Layout.cshtml dosyasında .css dosyalarını nasıl ayarlayacağımı biliyorum, ancak görüntüleme başına bir stil sayfası uygulamaya ne dersiniz?

Buradaki düşüncem, _Layout.cshtml dosyasında, <head>çalışmak için etiketlerinizin olduğu, ancak mizanpaj dışı görünümlerinizden birinde değil. Nerede mi <link>etiketleri gitmek?

css asp.net-mvc razor

— MrBoJangles
kaynak

340

Tüm site arasında yeniden kullanılan CSS için bunları aşağıdaki <head>bölümde tanımlarım _Layout:

<head>
    <link href="@Url.Content("~/Styles/main.css")" rel="stylesheet" type="text/css" />
    @RenderSection("Styles", false)
</head>

ve bazı görünüme özgü stillere ihtiyacım varsa Stylesher görünümdeki bölümü tanımlarım :

@section Styles {
    <link href="@Url.Content("~/Styles/view_specific_style.css")" rel="stylesheet" type="text/css" />
}

Düzenleme: @RenderSection, false parametresindeki ikinci parametrenin, bölümün bu ana sayfayı kullanan bir görünümde gerekli olmadığını ve görünüm motorunun tanımlanmış "Stiller" bölümünün olmadığı gerçeğini göz ardı edeceğini bilmek yararlıdır. sizin görüşünüze göre. True olursa, görünüm oluşturulmaz ve "Stiller" bölümü tanımlanmadığı sürece bir hata atılır.

— Darin Dimitrov
kaynak

4

Bilirsiniz, ikinci düşüncede, bu o kadar da kötü değil. Bence bu sadece yeni ve farklı.

— 11:20

@section Styles -> diyor ki, Styles Styles bölümünü çözemezsiniz, bu ne anlama geliyor?

— nceki

2

@Sam, Mizanpajınızda böyle bir bölüm tanımlanmadığı anlamına gelir.

— Darin Dimitrov

@DarinDimitrov Üstbilginin sonunda değil, tam konumda oluşturmanın bir yolu var mı? Ben css öncelikleri için belirli bir düzen tutmak istiyorum.

— Marc

@Marc RenderSectionBaşlığın sonunda değil (şaşırtıcı bir şekilde :) olarak adlandırdığınız bir yerde işlenir .

— David Ferenczy Rogožan

22

Böyle bir blok eklemeyi denedim:

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

Ve _Layout.cshtml dosyasında karşılık gelen bir blok:

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

Hangi işe yarıyor! Ama yardım edemem ama daha iyi bir yol olduğunu düşünüyorum. GÜNCELLEME: @RenderSectionBir @sectionçağrı eklemeyi ihmal ettiğinizde görünümünüzün dağılmaması için ifadeye "false" eklendi head.

— MrBoJangles
kaynak

Ben daha iyi bir yolu yok, ancak ben bölüm adını "Head".

— SLaks

Kesinlikle haklısın. "PageStyle" olarak adlandırılması, bunun yalnızca bu amaç için olduğunu gösterir.

— MrBoJangles

1

Bunu böyle yaparsanız, tüm Görünümlerde "MyStyles" eklemeniz gerekir, Darins cevabı ile giderdim.

— Filip Ekberg

Tamamdır. Bu yüzden yanlış argümanı ekledim @RenderSection(). İyi yakalama.

— MrBoJangles

12

kullanma

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

veya

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

sizin için çalışabilir.

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

— Nishanth Shaan
kaynak

4

Lütfen yinelenen yanıtlara bağlantı göndermeyin . Bunun yerine, gelecekteki kullanıcıların bağlantılı gönderide açıklandığı gibi ihtiyaç duydukları yanıtı bulmalarına yardımcı olabilecek diğer işlemleri düşünün.

— Mogsdad

3

mizanpaj, kalıp sayfa ile aynı şekilde çalışır. herhangi bir css referans düzeni var, herhangi bir alt sayfalar olacaktır.

Scott Gu'nun burada mükemmel bir açıklaması var

— BentOnCoding
kaynak

1

Çok minnettarım. Ancak, sorum şu, "ana" değil, tek bir görünüme nasıl referans ayarlayabilirim.

— MrBoJangles

1

İstemci Bağımlılık dll gelen jilet html yardımcı kullanmayı tercih

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

— john blair
kaynak

0

Bu yapıyı Layout.cshtml dosyasında yapabilirsiniz

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

— mofidul
kaynak

1

Bu, görünüm başına stil sayfasını seçmeme nasıl izin verir?

— MrBoJangles

Ayrıca her bölüme bir sınıf veya kimlik ekleyebilirsiniz ve başlığın içinde mofidul tarafından belirtilene benzer bir stile sahip olabilirsiniz. Yaptığım şey sass ile çalışmak, bu yüzden her görünümün ayrı bir sınıf kabı var. Bu şekilde, her bölüm için sonunda daha yapılandırılmış ve organize olan sass sayfaları oluşturdum.

— Leo

rel = "stylesheet" ne anlama geliyor?

— Sven Krauter