可以在 ASP.NET MVC5 應用程序中覆蓋引導程序 CSS 嗎？

Question

我對使用 ASP.NET MVC5 比較陌生。 內置 Bootstrap 很好，但基於 Site.css 文件更改 CSS 似乎非常粗糙。

我的樣式表 (Site.css) 在我的解決方案的Content文件夾中。

那里有類似的問題，但這些是我嘗試過的答案（如下所示，顯然在引導程序之后有文件......）

我僅使用內聯 CSS 和 jQuery 取得了一些成功，但我希望能夠使用我的樣式表。

似乎從依賴捆綁包切換到這條線......

@Styles.Render("~/Content/css")

因為參考更合適......但它仍然沒有持續更新我的樣式。

所以在挖掘了一些舊問題之后，我發現了這個......

<link href="@Url.Content("/~Content/Site.css")" rel="stylesheet" type="text/css" />

它似乎偶爾會起作用，但並非始終如一......

起初我認為它與強類型引導文件有關，元素獲得更具體的樣式點，但即使在嘗試最強的 id/elementname/nesting 組合時，它仍然無法工作。 （我想做懸停之類的，但即使是像改變文本顏色這樣簡單的事情也不起作用）

這個策略有什么巨大的缺陷嗎？

有什么我想念的嗎？

據我所知，這應該不是一個大問題，如果有人能幫助我或至少告訴我為什么我錯了，我將不勝感激。

謝謝。

Answer 1

您可以更新樣式包，甚至刪除所有引導程序 css 並添加您的。 Javascript 捆綁包相同。

https://www.tutorialsteacher.com/mvc/stylebundle-mvc

捆綁包中列出的包含部分是將用於特定捆綁包的文件列表，您在 razor 頁面中按名稱引用，就像您在示例中所做的那樣。

Answer 2

只是為了確保：沒有任何關於 ASP.Net/MVC 等強加關於 styles 的任何內容。

• 您可以使用或不使用 Bootstrap，或任何其他樣式框架
• Bootstrap 不是“內置”的，它只是為您搭建MVC應用程序時的默認設置

順便說一句，如果您不想使用，則不必使用 Bootstrap。

• /App_Start/BundleConfig.cs - 這是您定義 CSS 和 javascript 框架的地方，您希望與應用程序捆綁的文件。 根據您的需要修改（添加/刪除/等）它。

除此之外，覆蓋 CSS 類與在任何地方幾乎相同（ASP.net 框架沒有強加任何東西）。

Hth

Answer 3

雖然 EdSF 提供的解決方案很好，但對於剛開始使用 mvc5 的人來說仍然不是很理解。 所以我會試着多解釋一點。

Go 至

/App_Start/BundleConfig.cs

這是捆綁所有樣式表的文件。

bundles.Add(new StyleBundle("~/bundles/css").Include(
                  //"~/Content/css/bootstrap.min.css",
                     "~/Content/css/Site.css",
                  "~/Content/css/jquery-ui-1.10.4.min.css"));

如果您不想使用它，請注釋掉引導程序行並像上面一樣添加 css。 但請記住，它將完全刪除引導程序，除非您為響應式網頁設計編寫了自己的引導程序樣式表，否則您應該保留它。

當您的視圖頁面在瀏覽器中呈現時，檢查設計不符合您的樣式表的元素並檢查該元素上的 class 名稱並用您自己的樣式表!important覆蓋該 class不會被其他任何東西覆蓋。

試試這些步驟。 祝你好運。

Answer 4

已解決：似乎主要問題是沒有在測試之間清除我的緩存。 雖然這看起來有點乏味，但我終於能夠獲得一些樣式。

但是我嘗試了另外 2 件事（來自 Stack-Overflow 上的其他問題），它們似乎都結合起來讓它更好地工作。 （盡管如果在刷新時始終重新加載更改而不重新啟動應用程序，那仍然會很好！（我運行並行，所以需要相當長的時間！）

無論如何！ 我做出的最有效的 (3) 改變

1. 清除緩存（因此瀏覽器被迫重新渲染腳本
2. 將“Bundle_Config”中的名稱從“site/css”更改為匹配“Site/css” （不肯定為什么它在腳手架中是這樣的......或者它是否重要......但它似乎與文件進行通信更一致。
3. 添加另一個引用（這最有幫助）除了發生在 _Layout.cshtml 中的 budleconfig 中的內置“renderStyles”之外，還添加了一個對相對路徑的附加樣式表引用。

<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />

授予我仍然需要偶爾清除緩存並重新啟動應用程序以查看更改，我至少能夠更改樣式...

感謝大家的幫助！