iconfont 在Vue在线引用

1.官方使用文档:iconfont使用方法
2.项目在线引用:
2.1拷贝css和js在线地址

拷贝css和js地址.png

注意事项:Font Class拷贝css地址,Symbol对应js地址,上面这两个地址都可能会变化,如果ui上传了新的图标,你需要引用他新增进来的,则需要更新地址:
如图:
2.2代码中引用:

 <script src="//at.alicdn.com/t/font_1299623_htra47f0zzt.js"></script>
<style lang="stylus">
  @import '//at.alicdn.com/t/font_1299623_htra47f0zzt.css'
</style>

2.3引用这个图标:

image.png

image.png

html模板实现

<svg class="icon" aria-hidden="true">
    <use xlink:href="#icondelete"></use>
</svg>

pug模板实现

  .icon
        svg.ali_icon(aria-hidden="true")
          use(xlink:href="#icondelete")
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。