美文网首页
Ant Design Pro 通过Unicode引入阿里巴巴图标

Ant Design Pro 通过Unicode引入阿里巴巴图标

作者: 6seaq | 来源:发表于2019-05-17 15:23 被阅读0次

    在根据Ant Design Pro文档按照Unicode引入业务图标时,根据文档发现一直出现问号无效图标。最终代码如下:

    @font-face {
      font-family: 'iconfont';  /* project id 1189004 */
      src: url('http://at.alicdn.com/t/font_1189004_tyiu2qkh7sc.eot');
      src: url('http://at.alicdn.com/t/font_1189004_tyiu2qkh7sc.eot?#iefix') format('embedded-opentype'),
      url('http://at.alicdn.com/t/font_1189004_tyiu2qkh7sc.woff2') format('woff2'),
      url('http://at.alicdn.com/t/font_1189004_tyiu2qkh7sc.woff') format('woff'),
      url('http://at.alicdn.com/t/font_1189004_tyiu2qkh7sc.ttf') format('truetype'),
      url('http://at.alicdn.com/t/font_1189004_tyiu2qkh7sc.svg#iconfont') format('svg');
    }
    
    :global{
      .iconfont {
        font-family: "iconfont" !important;
        font-size: 16px;
        font-style: normal;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
      }
    }
    

    url里面一定需要带上http,ant design pro 上的文档只有斜杆//加载的本地。而且样式也会影响到图标的展示,根据需要调整样式。

    相关文章

      网友评论

          本文标题:Ant Design Pro 通过Unicode引入阿里巴巴图标

          本文链接:https://www.haomeiwen.com/subject/kmkoaqtx.html