Question

我正在使用Zurb Foundation，制作手风琴。 Zurb手风琴带有一个CSS三角形作为转换器，但我想使用两个字体真棒图标，取决于li是否具有活动类。现在我正在获取图标图像的占位符。

如果可能的话，宁愿只使用CSS。

这是我的 CSS ：

    ul.accordion > li > div.title:after { content:"\f067"; display: block; width: 0; 
height: 0; position: absolute; right: 20px; top: 8px;}

    ul.accordion > li.active .title:after { content:"\f068"; display: block; width: 0; 
height: 0; }

以下是 HTML ：

<ul class="accordion">
  <li class="active">
    <div class="title">
      <h5>Accordion Panel 1</h5>
    </div>
    <div class="content">
      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
    </div>
  </li>

 <li>
    <div class="title">
      <h5>Accordion Panel 1</h5>
    </div>
    <div class="content">
      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
    </div>
  </li>
</ul>

Answer 1

显示的CSS未指定font-family: FontAwesome;。尝试添加它。

看起来这不是一个许可问题，但如果其他人出现我将离开链接。

对于localhost，对字体本身的更改权限可以提供帮助：Icon font (@font-face) not rendering on localhost

Firefox可能存在跨域问题：http://www.red-team-design.com/firefox-doesnt-allow-cross-domain-fonts-by-default

如何将字体图标添加到手风琴 - zurb基础

1 个答案: