1

コードに 3 つの css ファイルをバンドルしたいと考えています。そのうちの 1 つは私の Web フォント用で、「url」を使用しています。しかし、アプリケーション ブラウザを実行すると、ファイルが見つかりません。

これは私のcssファイルです：

@font-face {
    font-family: 'neuropol';
    src: url('../Files/Font/neuropol_x_free-webfont.eot');
    src: url('../Files/Font/neuropol_x_free-webfont.eot?#iefix') format('embedded-opentype'),
         url('../Files/Font/neuropol_x_free-webfont.woff') format('woff'),
         url('../Files/Font/neuropol_x_free-webfont.ttf') format('truetype'),
         url('../Files/Font/neuropol_x_free-webfont.svg#neuropol_x_freeregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

そして、これは私のバンドルコードです:

bundles.Add(new StyleBundle("~/bundles/styles/base").Include("~/Content/Styles/style.css", "~/Content/Styles/normalize.css", "~/Content/Styles/webfont.css"));

誰でも問題を解決するのを手伝ってもらえますか?

4

3 に答える 3

5

CSS 定義に src URL がある場合、ブラウザは CSS ファイルをダウンロードした場所からの相対パスをチェックします。~/bundles/Files/Font/...この場合、それはではなく でsrc ファイルを探していることを意味します ~/Content/Files/Font/...。

バンドル名を相対位置と一致させてみてください。

bundles.Add(new StyleBundle("~/Content/Styles/base-bundle.css").Include("~/Content/Styles/style.css", "~/Content/Styles/normalize.css", "~/Content/Styles/webfont.css"));
于 2013-02-25T16:32:09.303 に答える
2

このリンクを見てください

基本的に、css ファイル内の URL を有効な URL に変換する変換を追加できます。

Bundles の設定を次のように変更することで、これを実現できます。

bundles.Add(
new StyleBundle("~/Content/Styles/base-bundle.css")
.Include("~/Content/Styles/style.css", new CssRewriteUrlTransform())
.Include("~/Content/Styles/normalize.css", new CssRewriteUrlTransform())
.Include("~/Content/Styles/webfont.css", new CssRewriteUrlTransform())
);
于 2015-05-20T14:36:20.117 に答える
0

このように App_Start>BundleConfig.cs に変更できます

     bundles.Add(new StyleBundle("~/Content/themes/base/css").Include(
                            "~/Content/themes/base/jquery.ui.core.css",
                            "~/Content/themes/base/jquery.ui.resizable.css",
                            "~/Content/themes/base/jquery.ui.selectable.css",
                            "~/Content/themes/base/jquery.ui.accordion.css",
                            "~/Content/themes/base/jquery.ui.autocomplete.css",
                            "~/Content/themes/base/jquery.ui.button.css",
                            "~/Content/themes/base/jquery.ui.dialog.css",
                            "~/Content/themes/base/jquery.ui.slider.css",
                            "~/Content/themes/base/jquery.ui.tabs.css",
                            "~/Content/themes/base/jquery.ui.datepicker.css",
                            "~/Content/themes/base/jquery.ui.progressbar.css",
                            "~/Content/themes/base/jquery.ui.theme.css"));

そして、head セクションでこのようにレイアウト ページにロードします。

@Styles.Render("~/Content/themes/base/css")
于 2013-02-26T13:12:29.463 に答える