2012-11-21 35 views
5

當我將jqm-icon-pack-2.1.2-fa.css添加到我的網站時,jQuery UI字體不顯示。如果我刪除了參考文獻,它們會顯示。我創建使用Visual Studio 2012的下面移動MVC4應用程序如何,我引用CSS文件:字體真棒圖標與jQuery UI圖標衝突

<link rel="stylesheet" href="@Url.StaticStylesheet("jquery.mobile-1.2.0.css")" type="text/css"> 
<link rel="stylesheet" href="@Url.StaticStylesheet("jquery.mobile.structure-1.2.0.css")" type="text/css"> 
<link rel="stylesheet" href="@Url.StaticStylesheet("jquery.mobile.theme-1.2.0.css")" type="text/css"> 
<link rel="stylesheet" href="@Url.StaticStylesheet("jqm-icon-pack-2.1.2-fa.css")" type="text/css"> 

如果我刪除最後一個引用,jQuery的圖標工作,但字體真棒圖標不工作。我試圖重新排序引用,並沒有奏效。我已經用Firebug檢查過這個頁面,我看不出有什麼不同。我確信路徑也是正確的。我想發佈一個鏈接到我的網站,但它在一個外部網內,因此無法訪問。我可以提供的最好的是我設置輸入鍵入=「搜索」,搜索圖標和清除文本圖標不會出現。任何幫助將不勝感激!!

回答:我解決了這個問題,並希望能像他一樣拯救他人一些悲傷和在鍵盤上敲打他們的頭幾個小時!當您使用NuGet Package Manager獲取jQuery mobile時,它會添加一些名爲icons-18-black.png,icons-18-white.png,icons-36-black.png和icons-36-white.png的圖像文件。如果你不小心,你可能會錯過在github網站上有一些稍微不同的圖像文件的事實,你需要包含Font Awesome圖標-18-black-pack.png,icons-18-white-pack.png ,圖標-36-black-pack.png和圖標-36-white-pack.png。請注意,這些文件的名稱中包含「pack」一詞,它們與jQuery mobile中包含的原始文件略有不同。只要確保你添加了缺失的文件以及ajax-loader.png文件,該文件與jQuery移動版中包含的ajax-loader.gif文件不同,並且所有文件都應該可以工作。

+1

您應該編輯出問題的答案,並將其作爲問題的實際答案發布,並將其標記爲已接受。這樣,當人們看到你的問題列出時,他們可以看到有一個工作解決方案。 – Jack

+0

對不起,我必須等待,才能將答案發布給我自己的問題。不知道這是爲什麼,但是因爲它可能我已經公佈了答案。謝謝! – Darrell

回答

3

我解決了這個問題,希望能像別人一樣拯救他人一些悲傷和在鍵盤上敲打他們的腦袋!當您使用NuGet Package Manager獲取jQuery mobile時,它會添加一些名爲icons-18-black.png,icons-18-white.png,icons-36-black.png和icons-36-white.png的圖像文件。如果你不小心,你可能會錯過在github網站上有一些稍微不同的圖像文件的事實,你需要包含Font Awesome圖標-18-black-pack.png,icons-18-white-pack.png ,圖標-36-black-pack.png和圖標-36-white-pack.png。請注意,這些文件的名稱中包含「pack」一詞,它們與jQuery mobile中包含的原始文件略有不同。只要確保你添加了缺失的文件以及ajax-loader.png文件,該文件與jQuery移動版中包含的ajax-loader.gif文件不同,並且所有文件都應該可以工作。