为什么要使用@font-face

email:gm4linus at gmail  dot com

前一篇文章(http://blog.csdn.net/notejs/article/details/17318099)介绍了@font-face及如何使用。这篇文章打算写写我们为什么使用@font-face。

1、设计师可以在网页端展示自己的设计,不受制于本地系统对字体的支持,凸显网站的与众不同。

2、可以使用自定义字体来定义图标(icon)。这点是本片文章主要想说的。


比如做一个移动端的wep app,app中会有很多的icon,如搜索、左箭头、右箭头、上箭头、下箭头等等,这些icon一般都是纯色的。如果这些icon通过自定义字体来实现(即每个icon是一个字符,比如我们输入a,显示出来的是左箭头)那么icon的可定制性就很高了,我们可以随意的定义颜色、大小、透明度等等,而且有一个好的浏览器兼容性。 


另一方面我们加载一个字体文件就可以加载所有icon,这样也可以减轻服务端的压力,更何况我们可以在浏览器端配置web缓存将字体文件缓存在浏览器端。相比图片精灵来说,自定义字体有更大的灵活性和可易维护性。


据我所知移动端开发框架Sencha Touch从2.2版本开始使用了自定义字体来实现icon。

以上是我的个人观点,欢迎大家指正不当之处,请注意第一行是我的邮箱。

你可能感兴趣的:(CSS)