2012-11-21 38 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文件不同,并且所有文件都应该可以工作。