1

尽我所能，我根本无法让 Font Awesome 工作。我已将 Font Awesome 包上传到我的根目录并链接到它。

<link rel="stylesheet" type="text/css" href="font-awesome/jqm-icon-pack-fa.css">

css 包含字体声明

@font-face {
font-family: 'FontAwesome';
src: url('font/fontawesome-webfont.eot');
src: url('font/fontawesome-webfont.eot?#iefix') format('embedded-opentype'),
     url('font/fontawesome-webfont.woff') format('woff'),
     url('font/fontawesome-webfont.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}

字体位于子目录 root/font-awesome/font/

我的链接标记示例：

<a href="#info"  data-rel="popup" data-mini="true"data-iconpos="notext" data-transition="slideup"data-role="button" ><i class="icon-cog"></i></a>

我放置什么图标标签似乎无关紧要 - 我得到一个空白圆圈。

任何建议都将是可观的。这发生在我的 Mac 上的 Firefox safari 和 iOS 6.0 上的 safari - iPhone

4

2 回答 2

1

我已经在 Font Awesome 4 和更早的版本上对此进行了测试。我下面的答案是基于版本 4。

所以你需要做的是从 Font Awesome 样式表中复制你的图标类并将它们添加到你自己的样式表中。然后只需在类名前添加ui-icon-即可。您还必须对创建字体系列的类执行此操作。

例如，如果您有data-icon="fa fa-cog"

font-family 类是.fa，这将变成.ui-icon-fa

.ui-icon-fa {}

而实际的图标 css .fa-cog将变为.ui-icon-fa-cog

.ui-icon-fa-cog:before {
 content: "\f013";
}

希望这是有道理的。

于 2013-11-01T13:57:01.120 回答
0

Font Awesome 网站示例是否适用于这些浏览器？

确保您的 HTML 文档类型是 HTML5：<!DOCTYPE html>

于 2013-09-16T09:44:22.630 回答