icon font字体图标在chrome浏览器被加粗和锯齿的解决办法|前端开发|码途山海.智隐长卷 -

程序人生|重庆纽新

找回密码
立即注册

QQ登录

只需一步,快速开始

欢迎访问【程序人生-重庆纽新】,本网站为软件开发人员视觉的IT资讯、软件开发中各种问题的解决办法!!
搜索
发新帖


2308

积分

0

好友

259

主题
楼主
发表于 2015-4-20 09:56:25 | 查看: 945| 回复: 0
icon font字体图标十分好用,就连bootstrap框架在最新的3.0版本也默认使用了。不过我们在使用过程中发现了一些问题,比如在Safari浏览器和Chrome浏览器下字体图标被加粗了等等,下面就提供一些解决办法:

icon font字体图标十分好用,就连bootstrap框架在最新的3.0版本也默认使用了。不过我们在使用过程中发现了一些问题,比如在Safari浏览器和Chrome浏览器下字体图标被加粗了等等,下面就提供一些解决办法:

1、在chrome浏览器下被加粗的解决办法

有些icon font字体图标可能在制作的过程中出现了半个像素的问题,在浏览器下就被显示称为一个像素,造成了加粗的现象。解决这个问题的办法就是使用-webkit-font-smoothing属性。

CSS代码为:.iconfont{-webkit-font-smoothing: antialiased;}

2、在chrome浏览器下放大出现锯齿的解决办法

CSS代码为:.iconfont{-webkit-text-stroke-width: 0.2px;}



收藏回复 只看该作者 道具 举报

高级模式
B Color Image Link Quote Code Smilies



QQ|小黑屋| 码途山海.智隐长卷 渝ICP备15002301号-2   渝公网安备50011202504426

GMT+8, 2025-5-18 03:22 , Processed in 0.044664 second(s), 25 queries .

©Copyright 程序人生!

©2012-2015重庆纽新

快速回复 返回顶部 返回列表