使用阿里图库unicode字体图标不显示?

使用阿里图库过程中为了兼容性,使用了unicode引入方法,如下:
1.css添加生成的@font-face

clipboard.png

2.写iconfontfff的样式:

clipboard.png

3.页面中引入:

clipboard.png

4.表现如下:

clipboard.png
不显示,求解,为什么?

阅读 15.1k
5 个回答

你的faont-family:"iconfontyyy"写错了吧,你定义的名字不是iconfont吗。。。

其实是阿里图库官方的实例代码写错了,少写了一个class类.icon,大家千万休息~

新手上路,请多包涵

官方的 url 路径是服务器地址。所以你必须放到真实服务器环境或者 开启本地测试服务器即可。

打开 iconfont 官方的 iconfont.css 结果发现里面的 css 类名中有一个空格。去掉就好了
clipboard.png

新手上路,请多包涵
[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'font_family' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

在css里 .iconfont 替换成上面的就好了
.iconfont {
font-family: "iconfont" !important;
font-size: 16px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进