HTML中用自定义字体实现小图标icon(不是原作,只是一个研究笔记)_html/css_WEB-I

最近在做一个项目时, 研究了一下新浪微博的前端, 看到首页中那个图标了吗, 以前看到这类效果的第一反应就是用一个gif之类的图标做出来!!

在f.ttf旁边就多了一个f.eot,

用css hack把f.eot文件加进之前的字体引用中

看效果

总结一下,

用这种方法给一些a标签 ul中的li标签 加一个icon, 其实很方便的, 而且只要制作的字体文件内容不多, 它的大小也就几k吧, 有些情况下相对于图片的icon好一些.

另外, 这种方法做的icon, 只能是纯色的, 像一些icon是有渐变效果的, 还是用图片会好一些?, 这个在开发的时候自行衡量呗!!

查看更多关于HTML中用自定义字体实现小图标icon(不是原作,只是一个研究笔记)_html/css_WEB-I的详细内容...