谷歌浏览器小字体处理方案即12px以下字体


Posted in HTML / CSS onDecember 17, 2013

谷歌浏览器是不支持12px以下小字体的,可能是考虑到用户体验吧。
网上也有一些文章介绍,说可以使用:

-webkit-text-size-adjust:none;
但是,自chrome 27之后,就取消了对这个属性的支持。

我们还有其它办法解决这个问题吗?

谷歌浏览器支持CSS缩放,于是,我们可以在这方面做文章:

-webkit-transform: scale(0.5);

既然最小支持到12px,那么就以12px为基点进行缩放,

同时可以使用-webkit-transform-origin-x: 0; 来解决缩放后margin-left的位移问题:

.test_tag{
font-size:12px;
-webkit-transform-origin-x: 0;
-webkit-transform: scale(0.5833333333333334);
}
scale值的计算方法为: 7 / 12 = 0.5833333333333334
 
HTML / CSS 相关文章推荐
CSS3 倾斜的网页图片库实例教程
Nov 14 HTML / CSS
CSS3中HSL和HSLA的简单使用示例
Jul 14 HTML / CSS
CSS3实现银灰色动画效果的导航菜单代码
Sep 01 HTML / CSS
CSS3的resize属性使用初探
Sep 27 HTML / CSS
html5中如何将图片的绝对路径转换成文件对象
Jan 11 HTML / CSS
自定义html标记替换html5新增元素
Oct 17 HTML / CSS
HTML中使用SVG与SVG预定义形状元素介绍
Jun 28 HTML / CSS
HTML5制作酷炫音频播放器插件图文教程
Dec 30 HTML / CSS
HTML块级标签汇总(小篇)
Jul 13 HTML / CSS
html5清空画布方法(三种)
Oct 16 HTML / CSS
使用HTML+Css+transform实现3D导航栏的示例代码
Mar 31 HTML / CSS
html+css合并表格边框的示例代码
Mar 31 HTML / CSS
利用html5的websocket实现websocket聊天室
Dec 12 #HTML / CSS
html5拍照功能实现代码(htm5上传文件)
Dec 11 #HTML / CSS
html5教程实现Photoshop渐变色效果
Dec 04 #HTML / CSS
html5教程调用绘图api画简单的圆形代码分享
Dec 04 #HTML / CSS
html5教程画矩形代码分享
Dec 04 #HTML / CSS
html5教程制作简单画板代码分享
Dec 04 #HTML / CSS
html5 viewport使用方法示例详解
Dec 02 #HTML / CSS
You might like
php算开始时间到过期时间的相隔的天数
2011/01/12 PHP
PHP中的cookie不用刷新就生效的方法
2012/02/04 PHP
浅析PHP的静态成员函数效率更高的原因
2014/06/13 PHP
php构造函数的继承方法
2015/02/09 PHP
关于捕获用户何时点击window.onbeforeunload的取消事件
2011/03/06 Javascript
jquery Mobile入门—外部链接切换示例代码
2013/01/08 Javascript
DWZ table的原生分页浅谈
2013/03/01 Javascript
JavaScript中的分号插入机制详细介绍
2015/02/11 Javascript
JavaScript中实现map功能代码分享
2015/06/11 Javascript
js实现鼠标点击文本框自动选中内容的方法
2015/08/20 Javascript
利用JS判断鼠标移入元素的方向
2016/12/11 Javascript
微信小程序 简单教程实例详解
2017/01/13 Javascript
Vue实现简易翻页效果源码分享
2018/11/08 Javascript
vue ssr 实现方式(学习笔记)
2019/01/18 Javascript
vue中keep-alive,include的缓存问题
2019/11/26 Javascript
Js实现粘贴上传图片的原理及示例
2020/12/09 Javascript
python操作xml文件详细介绍
2014/06/09 Python
win7上python2.7连接mysql数据库的方法
2017/01/14 Python
Python新手入门最容易犯的错误总结
2017/04/24 Python
深入理解Django中内置的用户认证
2017/10/06 Python
python查看列的唯一值方法
2018/07/17 Python
python 缺失值处理的方法(Imputation)
2019/07/02 Python
Python如何应用cx_Oracle获取oracle中的clob字段问题
2019/08/27 Python
python logging.basicConfig不生效的原因及解决
2020/02/20 Python
python3爬虫中异步协程的用法
2020/07/10 Python
关于Kotlin中SAM转换的那些事
2020/09/15 Python
Python根据URL地址下载文件并保存至对应目录的实现
2020/11/15 Python
python实现企业微信定时发送文本消息的示例代码
2020/11/24 Python
python中os.remove()用法及注意事项
2021/01/31 Python
会计助理的岗位职责
2013/11/29 职场文书
个人贷款承诺书
2014/03/28 职场文书
会计学习心得体会
2014/09/09 职场文书
总账会计岗位职责
2015/04/02 职场文书
2015小学语文教师个人工作总结
2015/05/20 职场文书
开工典礼致辞
2015/07/29 职场文书
Python竟然能剪辑视频
2021/05/25 Python