字节小程序
开发者社区
小程序小游戏
登录
无法使用iconfont,怎么办呢

无法使用iconfont,怎么办呢

1652浏览作者: 用户5701864923463

需求的场景描述

引用iconfont,但没法显示出来。

ttss

@font-face {
  font-family: 'ss-font';  /* Project id 2638195 */
  src: url('//at.alicdn.com/t/font_2638195_0cbhrfgopmrk.woff2?t=1624953762803') format('woff2'),
       url('//at.alicdn.com/t/font_2638195_0cbhrfgopmrk.woff?t=1624953762803') format('woff'),
       url('//at.alicdn.com/t/font_2638195_0cbhrfgopmrk.ttf?t=1624953762803') format('truetype');
}
  .ss-icon__info {
    position: absolute;
    right: 0;
    top: -8px;
    color: #fff;
    font-size: 12px;
    font-family: PingFang SC, Helvetica Neue, Arial, sans-serif;
    text-align: center;
    box-sizing: border-box;
    padding: 0 3px;
    min-width: 16px;
    line-height: 14px;
    border-radius: 16px;
    background-color: #f44;
    -webkit-transform: translateX(50%);
    transform: translateX(50%);
    -webkit-transform-origin: 100%;
    transform-origin: 100%;
    white-space: nowrap;
  }
  
  .ss-font {
    font-family: "ss-font" !important;
    font: normal normal normal 14px/1 "ttui";
  }
  .ss-icon-index:before {
    content: "\e6bb";
  }
  .ss-icon-back:before {
    content: "\e605";
  }

ttml

<view
    class=" custom-class ss-font ss-icon-back"
    style="{{ color ? 'color: ' + color : '' }}; {{ size ? 'font-size: ' + size : '' }}; {{ block ? 'display:block ' : '' }}"
    bindtap="onClick"
>
    
</view>

在社区里也有同学问过相同的问题(https://forum.microapp.bytedance.com/mini-app/posts/5dc65244f5dbe415dc15533f)

管理员回答说是能用的,模仿过管理员同学的代码,管理员用的标签是<i></i>

但<i>标签被解析成<div>,同时图标也没法显示出来。

希望提供的能力

这要怎么办呢?头条小程序现在还没有显示iconfont的能力吗

最后一次编辑于 2021年07月03日
加载中