font awesome(4.0.3) + bootstrap(3.0.0) + asp.net: 改变字体系列答案

【问题标题】：font awesome(4.0.3) + bootstrap(3.0.0) + asp.net: changing font familyfont awesome(4.0.3) + bootstrap(3.0.0) + asp.net: 改变字体系列
【发布时间】：2014-05-03 08:18:00
【问题描述】：

我正在使用字体 awesome(4.0.3) 和 bootstrap(3.0.0)，我只想更改字体。但有一个问题。不再显示“font awesome”中的“fa fa-group”之类的所有 css 类，而是有一个带有 Unicode 符号的小矩形，例如“F06E”（分为 2 行）（文本已格式化，但符号将被转换为 unicode-text)。

HTML：

<li class="dropdown">
<a href="@Url.Action( "Management", "MasterData")" class="dropdown-toggle"><i class="fa fa-cog"></i> Stammdaten</a>
<ul class="dropdown-menu">
<li>@Html.ActionLink(" Verwaltung", "Management", "MasterData", null, new { @class = "fa fa-group" })</li>
</ul>
</li>

CSS：

.navbar .nav li  a {
  font-family: "Helvetica Neue",Helvetica,Arial,sans-serif ;  
    text-decoration:underline;
}

我能做什么？！

Live-example on JSFiddle

最好的问候马丁

【问题讨论】：

您是否已将 FA 中的 fonts 复制到您的站点中？它们是否被正确引用（并且没有在浏览器中返回 404）？
是的，它正在工作。我正在使用在标题中，但只要我使用“.navbar .nav li a”，符号就会自动转换为 unicode ...
你能举个 JSFiddle 的例子吗？
是的：jsfiddle.net/lovingfood/cz93E（更新了我的主要条目）
谢谢！我现在知道了。正在回答...

标签： css asp.net-mvc-4 twitter-bootstrap razor font-awesome-4

【解决方案1】：

问题是您的 Anchor 标签上有 FA 类。相反，它们需要属于内联内容（例如斜体标记），作为 Anchor 标记的 inner-html。

使用此代码（并使用您的 JSFiddle 示例），您尝试在同一标签上使用两种字体：图标的 FA 字体和普通文本的 Helvetica 字体。这也是它适用于您的 Dropdown Toggle，但不适用于下拉元素的原因。

因为锚点需要内部 HTML，而不仅仅是纯文本，所以需要使用不同的帮助器；使用Url.Action，就像在下拉切换中一样，构建链接的 HREF 值，而不是 Html.ActionLink 构建整个链接标签。

试试这个

<li class="dropdown">
  <a href='@Url.Action( "Management", "MasterData" )' class="dropdown-toggle"><i class="fa fa-cog"></i> Stammdaten</a>
  <ul class="dropdown-menu">
    <li><a href='@Url.Action( "Management", "MasterData" )'><i class="fa fa-group"></i> Verwaltung</a></li>
  </ul>
</li>

【讨论】：