标签:导入 产品 com 使用 主题 ace 巴巴 解压 splay
网页图标
<head> <!--制作icon第三方网站:http://www.bitbug.net/ --> <link rel="shortcut icon" href="favicon.ico" /> </head>
网站优化三大标签
<head> <title>网站名(产品名) + 网站介绍</title> <meta name="description" content="网站的总体业务和主题描述" /> <meta name="keywords" content="网站关键词" /> </head>
字体图标
阿里巴巴矢量图标库 https://www.iconfont.cn/
icomoon.io https://icomoon.io/
icomoon图标使用
下载 : 进入icomoon官网 > 右上角(IcoMoon App) > 挑选图标 > 右下角(Generate Font) > 右下角(Download)
下载完后解压 > 得到font文件夹 > 将font文件夹放到项目根目录 (解压后的文件夹不要删除掉,以后追加图标时有用)
追加图标:进入icomoon官网 > 右上角(IcoMoon App) > 挑选图标前先通过左侧 import Icons将原来解压文件夹中的selection.json导入,然后接着选新图标下载 > 下载完后解压得到新的fonts文件夹,将项目中原fonts文件夹删除掉,将新的fonts文件夹拷贝项目根目录即可。
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <style> /* 解压文件夹中style.css中的代码段,注意路径引用是否正确 */ @font-face { font-family: ‘icomoon‘; src: url(‘fonts/icomoon.eot?g9re9z‘); src: url(‘fonts/icomoon.eot?g9re9z#iefix‘) format(‘embedded-opentype‘), url(‘fonts/icomoon.ttf?g9re9z‘) format(‘truetype‘), url(‘fonts/icomoon.woff?g9re9z‘) format(‘woff‘), url(‘fonts/icomoon.svg?g9re9z#icomoon‘) format(‘svg‘); font-weight: normal; font-style: normal; font-display: block; }
/*为应用图标的元素设置字体样式,名称要与@font-face中的字体名称一致*/ span { font-family: ‘icomoon‘; } </style> </head> <body> <!--解压文件夹中demo.html中复制想要的图标到span中,此时看不到任何效果,需为span添加字体icomoon后才能看到图标的显示--> <span>?</span> </body> </html>
标签:导入 产品 com 使用 主题 ace 巴巴 解压 splay
原文地址:https://www.cnblogs.com/tab15/p/13197513.html