首頁 >web前端 >css教學 >如何解析 MVC4 樣式包中的影像路徑?

如何解析 MVC4 樣式包中的影像路徑?

Patricia Arquette
Patricia Arquette原創
2024-12-16 14:39:11550瀏覽

How to Resolve Image Paths in MVC4 Style Bundles?

影像的MVC4 StyleBundle 解析度

在處理獨立CSS 和影像集(如jQuery UI 中的影像集)時,在MVC4中捆綁CSS 會帶來挑戰。為了確保影像的正確分辨率,請遵循以下準則:

定義 StyleBundle

建立 StyleBundle 時,指定與實體內容路徑不衝突的虛擬路徑。例如:

bundles.Add(new StyleBundle("~/Content/css/jquery-ui")
     .Include("~/Content/css/jquery-ui/*.css"));

相對圖片路徑

CSS 中的圖片路徑應該相對於 CSS 檔案本身。這很重要,因為捆綁處理程序會將 URL 中的虛擬路徑替換為捆綁 CSS 的實際路徑。

從相同資料夾捆綁 CSS

捆綁 CSS來自相同資料夾的檔案可確保相對圖片路徑繼續有效。在與原始檔案相同的路徑上定義您的套件:

bundles.Add(new StyleBundle("~/Content/css/jquery-ui/bundle")
     .Include("~/Content/css/jquery-ui/*.css"));

CssRewriteUrlTransformation

或者,您可以套用CssRewriteUrlTransformation 來重寫對CSS 檔案的相對URL引用捆綁。這允許從不同的資料夾進行捆綁,同時保持影像解析度:

bundles.Add(new StyleBundle("~/Content/css/jquery-ui/bundle")
     .Include("~/Content/css/jquery-ui/*.css",
              new CssRewriteUrlTransform()));

以上是如何解析 MVC4 樣式包中的影像路徑?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn