Layui+阿里ICON，扩展图标|ICONFONT+

最新推荐文章于 2024-07-21 12:32:26 发布

Morgerfk

最新推荐文章于 2024-07-21 12:32:26 发布

阅读量2.3k

点赞数

分类专栏： js layui html5 文章标签： javascript css html5 layui icons

本文链接：https://blog.csdn.net/qq_42485683/article/details/111357622

版权

本文介绍如何扩展Layui的内置图标，通过集成阿里ICONFONT。步骤包括搜索并下载所需图标，研究layui自带图标的引入方式，然后在layui的css文件夹下创建扩展文件并引入下载的图标。同时，解析了.eot, .woff, .ttf等不同字体格式的作用和用途。" 107136668,8753340,解决Spring Boot官方Demo命令行运行无响应问题,"['java', 'spring boot', 'maven']

摘要由CSDN通过智能技术生成

Layui+阿里ICON，扩展图标|ICONFONT+

Q:Layui自带的内置图标太少了
在这里插入图片描述

A:白嫖阿里！

1.搜索需要的icons，下载解压。
在这里插入图片描述
2.查看内容，打开iconfont.css研究内容准备引入，具体如下

@font-face {layui-icon: "iconfont";
  src: url('iconfont.eot?t=1608260815957'); /* IE9 */
  src: url('iconfont.eot?t=1608260815957#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAANwAAsAAAAAB1QAAAMjAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCCcAqCXII3ATYCJAMICwYABCAFhG0HNBthBsgekiSQCAEFAKoAhhni4b/92n3zZxdxjVSzJBoiibynk1RaJRW6lsChTT0DhVFBBun9NusVKAKPoRVpKs/dmtlh7BP3Tn9LfD6gHMeatAatTV2A8daA9sY2UBYXUGDcMHZBSzxOoNagaKKN0upmUMrMcYE457kBUGa0ckNsqBbKFUuzeASZ6nQlXgQegu/Hn8RQkpQKZsL+Wckw5H91Wz7JYcthHgG86cxgqygwD2TiuNK6SxIF5knUqgGpUbCt2OCr22LxuJv94xFEmRldD/oh95p4Dv9SMxLIrr29AlwOehSl+j5VmP++1tfhLi03rF+537pLbt60srp2yffyvuVmdfa6q6dHYe4lrgPUnb6aOTJ9dvLwVMe5qok893dR97y/HUl0+5j7NvRl6LxViJutiBuurm++wOHN1c3k5jnruN5e3/bbKXK/5f5uR7xj+fPg5+GT0S6fD29tpTmY/vveTtqdfWXrMPUgZ6xROaFyVyQHmBfd&#