JavaScript 输出
152
2023-11-10
本工具用于解决以下问题
接手二手项目时,不清楚项目中定义了哪些 icon。
使用外部样式库,成套的后台管理系统框架时。找到其 icon 的定义列表比较麻烦。
复制在线资源链接
之前一直只知道怎么用 iconfont ,但并没有深入了解相关知识,最新学习了一下,在这里跟大家分享。
unicode 模式
引用 iconfont 和引用自定义字体,使用的代码是一样
定义字体族
@font-face {
font-family: 'iconfont'; /* 自定义字体族名,可以是任意名, */
src: url('//at.alicdn.com/t/font_1357308_kygursq6jw.eot'); /* 字体描述文件链接 */
src: url('//at.alicdn.com/t/font_1357308_kygursq6jw.eot?#iefix') format('embedded-opentype'), /* 兼容 IE9 */
url('//at.alicdn.com/t/font_1357308_kygursq6jw.woff2') format('woff2'), /* 兼容 IE6-IE8 */
url('//at.alicdn.com/t/font_1357308_kygursq6jw.woff') format('woff'), /* 兼容 chrome, firefox, opera, Safari, Android, iOS 4.2+ */
url('//at.alicdn.com/t/font_1357308_kygursq6jw.ttf') format('truetype'), /* 兼容 chrome, firefox, opera, Safari, Android, iOS 4.2+ */
url('//at.alicdn.com/t/font_1357308_kygursq6jw.svg#iconfont') format('svg'); /* 兼容 iOS 4.1及以上 */
}
使用字体族(无论是文本还是icon)
.iconfont {
font-family: "iconfont" !important; /*使用自定义字体或者icon*/
/* 上面一句,和我们平时定义「微软雅黑」(font-family: "Microsoft YaHei", sans-serif;)字体是同样的语法 */
/* 只是「微软雅黑」在大部分电脑都会自带有,浏览器能直接找到系统的「微软雅黑」字体描述文件,不需要我们自己定义字体族,不需要使用外部的字体描述文件 */
}
(中文对应ASCII码);
。例如,把“最新” 转换成“最新”Font class
Symbol
工具的原理很简单,通过以下几个步骤实现
为什么本地文件只支持 ttf ?
为什么需要借助 opentype.js 解析 ttf 文件
#免责声明#
爱尔美收录网提供的一切软件、教程和内容信息仅限用于学习和研究目的;不得将上述内容用于商业或者非法用途,否则,一切后果请用户自负。本站信息来自网络收集整理,版权争议与本站无关。您必须在下载后的24个小时之内,从您的电脑或手机中彻底删除上述内容。如果您喜欢该程序和内容,请支持正版,购买注册,得到更好的正版服务。我们非常重视版权问题,如有侵权请邮件vip@iermei.com与我们联系处理。敬请谅解!
本文地址:https://www.iermei.com/xq/14.html