Question

我花了很多时间寻找合理的原因，从浏览器设置到unicode范围。

基本上，我从这里开始遵循教程：http://tympanus.net/Blueprints/ResponsiveIconGrid/ 我在我的网站上成功实现了它。功能，风格 - 一切都在检查。除了代替图标，我看到矩形/正方形，至少可以说这是令人沮丧的。

我使用完全相同的浏览器来查看这两个网站，我可以看到codrops上的图标就好了。你们/女孩对这可能是什么问题有任何暗示吗？

这是添加字体的CSS，它似乎在检查中：

@font-face {
    font-family: 'anyoldicon';
    src:url('assets/anyoldicon.eot');
    src:url('assets/anyoldicon.eot?#iefix') format('embedded-opentype'),
        url('assets/anyoldicon.woff') format('woff'),
        url('assets/anyoldicon.ttf') format('truetype'),
        url('assets/anyoldicon.svg#anyoldicon') format('svg');
    font-weight: normal;
    font-style: normal;
    unicode-range: U+00-FFFF;
}

这是我的HTML：

<li>
    <a href="#">
        <span class="cbp-ig-icon cbp-ig-icon-whippy"></span>
        <h3 class="cbp-ig-title">George</h3>
        <span class="cbp-ig-category">Smith</span>
    </a>
</li>

我可能错过了什么？老实说，我宁愿不显示网址，因为它不会教你什么。正如所描述的那样 - 相同的布局，但在一个网站上可见并在另一个网站上断开。

此处还有与图标和网格动画相对应的完整CSS：http://pastebin.com/94UgpN8B我还应该提到这个图标字体是由IcoMoon生成的，如果有任何帮助的话。

我正在使用Muse来编译网站，说实话，其他项目中的图标也没有用。可能是那里的东西吗？

我在控制台中没有收到有关资产的任何404错误。

我还尝试分别定义图标样式，以便消除不正确继承类属性的可能性（查看pastebin CSS），但这也不起作用。

修改这是另一个.CSS文件，它对应于此“插件”功能的其他部分。除了非常标准的morenizr.js

之外，它是唯一对此有任何影响的文件

hxxp：//pastebin.com/c7w1LEBf

Answer 1

你的文件夹结构是什么？

您的css文件放在哪里，是否在单独的文件夹中？如果字体位于“assets /”和css in“assets / css”中，则需要将路径更改为src:url('../assets/anyoldicon.eot');
注意路径前面的“ ../ ”

自定义字体显示在教程网站中，但不在我的网站上？

1 个答案: