MVC4 スタイル バンドルの画像パスを解決するにはどうすればよいですか?

画像の MVC4 スタイルバンドル解像度

MVC4 で CSS をバンドルすると、jQuery UI にあるようなスタンドアロン 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 中国語 Web サイトの他の関連記事を参照してください。