图标字体介绍 在介绍图标字体之前，不得不介绍图标格式ICON ICON是一种图标格式，我们操作系统中各种应用程序都包含一个图标 比如QQ程序的图标是一个可爱的企鹅，我的电脑是一个显示器图标 一个图标文件是扩展名为.ICO或者ICON的文件 直到现在图标文件还是在计算机程序中随处可见 但有时候需要在不 ...
对字体进行抗锯齿渲染可以使字体看起来会更清晰舒服。在图标字体成为一种趋势的今天，抗锯齿渲染使用也越来越多。 font-smoothing是非标准的CSS定义。它被列入标准规范的草案中，后由于某些原因从web标准中被移除了。 但是，我们可以用以下两种定义进行抗锯齿渲染 -webkit-font-smo ...
分类：
Web程序 时间：
2020-02-06 01:47:13
阅读次数：
122
前言 作为一个有追求有信仰的程序员，做一个网站绝不是仅仅能用就行了，当我们实现功能后，或者在写代码的过程中就要考虑怎么去优化，一个网站要去优化，作为前端要考虑的是资源优化（减少 http 请求啊，固定图片压缩啊，精灵图合并啊，或者使用图标字体啊），安全问题（代码压缩丑化，存储 cookie 或者st ...
分类：
Web程序 时间：
2020-01-17 18:56:52
阅读次数：
118
字体 font familu:"Consolas,Helvetica,"Helvetica Neue",Arial,sans serif; font size:3em; @font face{ font family:"Abc",sans serif;//名字 src:url("....") } f ...
分类：
Web程序 时间：
2020-01-06 17:42:55
阅读次数：
88
一、原理： 字体图标是在 Web 项目中使用的图标字体，利用CSS3 @font-face 规则引入雪碧图文件，通过方位显示某个图标，常用图标可直接使用glyphicons/font-awesome; 官网：http://fontawesome.io/ 官网：https://glyphicons.c ...
分类：
其他好文 时间：
2019-12-27 13:19:39
阅读次数：
624
前言 还记得以前开发的项目目录下都会存放一大堆图标文件，难以维护，同时图标和字体的对齐也是一个麻烦事儿； 下面简单列出字体图标的优劣势，内容摘自 "图标字体的优缺点和使用" 优势 轻量级 ：一个图标字体要比一系列的图像要小。一旦字体加载了，图标就会马上渲染出来，不需要下载一个个图像。这样可以减少HT ...
分类：
其他好文 时间：
2019-12-11 23:25:06
阅读次数：
99
icon-font 图标字体的使用， 方法一：可以在icomoon下载相应的图表字体，官网为：https://icomoon.io/ 进去会提供600+的免费图表，如果想要更多的图表字体可选择Icon Library；如图所示： 选择好需要的图标后点击右下角的Generate Font生成图标，生成 ...
分类：
其他好文 时间：
2019-11-06 23:07:47
阅读次数：
71
字体图标 图片是有诸多优点的，但是缺点很明显，比如图片不但增加了总文件的大小，还增加了很多额外的"http请求"，这都会大大降低网页的性能的。更重要的是图片不能很好的进行“缩放”，因为图片放大和缩小会失真。 我们后面会学习移动端响应式，很多情况下希望我们的图标是可以缩放的。此时，一个非常重要的技术出 ...
分类：
Web程序 时间：
2019-10-16 20:21:57
阅读次数：
142
1. 下载下来的压缩文件中，字体文件.eot.svg.ttf.woff和iconfont.css放进项目，其它文件没用 2. 在全局main.js引入iconfont.css 3. 然后在需要图标的页面相应的地方插入class="iconfont"即可 ...
分类：
其他好文 时间：
2019-10-06 00:23:18
阅读次数：
90
浅谈css的伪元素::after和::before css中的::after和::before已经被大量地使用在我们日常开发中了，使用他们可以使我们的文档结构更加简洁。但是很多人对::after和::before仍不是特别了解，究竟他们是做什么的？如何使用他们？什么时候应该使用他们？笔者总结了一些对 ...
分类：
Web程序 时间：
2019-09-10 17:54:53
阅读次数：
1051
