开发者社区> 问答> 正文

@font-face图标是方框,怎么回事?

使用某个插件,然后,然后按照操作,该放的都放了,然后,就是那些图标出现方框,不显示,这怎么回事。
这跟font-face有关吗?
如何解决?
screenshot
screenshot
完全不知道这种图标是怎么回事!!我要去下载这字体,还是什么东东么?源码包都没有..

展开
收起
a123456678 2016-03-12 11:39:16 5760 0
1 条回答
写回答
取消 提交回答
  • font-awesome库的官网地址: http://fontawesome.io/
    font-awesome里面还有个fonts文件夹,你要把字体文件放到对应的位置;或者放入一个任意的位置,然后修改font-awsome.css里面url地址。

    @font-face {
      font-family: 'FontAwesome';
      src: url('../fonts/fontawesome-webfont.eot?v=4.5.0');
      src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.5.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff2?v=4.5.0') format('woff2'), url('../fonts/fontawesome-webfont.woff?v=4.5.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.5.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.5.0#fontawesomeregular') format('svg');
      font-weight: normal;
      font-style: normal;
    }
    font-awesome及其类似icon库的工作原理:
    在css定义一些类似这样的样式:
    
    .fa-cog:before {
      content: "\f013";
      font: FontAweSome;
    }

    f013是一个一般字体里不存在的字符,对这个字符应用FontAweSome这个字体,而这个字体里面有这个图标的描述。以达成了想要的效果。
    出现方块的原因就是FontAweSome字体没有加载成功。

    2019-07-17 19:00:35
    赞同 展开评论 打赏
问答地址:
问答排行榜
最热
最新

相关电子书

更多
低代码开发师(初级)实战教程 立即下载
冬季实战营第三期:MySQL数据库进阶实战 立即下载
阿里巴巴DevOps 最佳实践手册 立即下载