谷歌浏览器小字体处理方案即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实现粒子旋转伸缩加载动画
Apr 22 HTML / CSS
Web前端绘制0.5像素的几种方法
Aug 11 HTML / CSS
css3制作动态进度条以及附加jQuery百分比数字显示
Dec 13 HTML / CSS
利用css3如何设置没有上下边的列表间隔线
Jul 03 HTML / CSS
css3实现冲击波效果的示例代码
Jan 11 HTML / CSS
html5 Canvas画图教程(9)—canvas中画出矩形和圆形
Jan 09 HTML / CSS
html5 的a标签 Href 拨电话的写法
Nov 04 HTML / CSS
html5响应式开发自动计算fontSize的方法
Jan 13 HTML / CSS
利用Node实现HTML5离线存储的方法
Oct 16 HTML / CSS
css3实现背景图片颜色修改的多种方式
Apr 13 HTML / CSS
纯CSS实现hover图片pop-out弹出效果的实例代码
Apr 16 HTML / CSS
Unicode中的CJK(中日韩统一表意文字)字符小结
Dec 06 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实现简单文件下载的方法
2015/01/30 PHP
使用PHPCMS搭建wap手机网站
2015/09/20 PHP
php获取当前月与上个月月初及月末时间戳的方法
2016/12/05 PHP
浅谈ThinkPHP5.0版本和ThinkPHP3.2版本的区别
2017/06/17 PHP
基于thinkphp5框架实现微信小程序支付 退款 订单查询 退款查询操作
2020/08/17 PHP
五段实用的js高级技巧
2011/12/20 Javascript
jquery禁用右键示例
2014/04/28 Javascript
让浏览器DOM元素最后加载的js方法
2014/07/29 Javascript
js实现简单的手风琴效果
2017/02/27 Javascript
JavaScript验证知识整理
2017/03/24 Javascript
JavaScript基于activexobject连接远程数据库SQL Server 2014的方法
2017/07/12 Javascript
javaScript之split与join的区别(详解)
2017/11/08 Javascript
JavaScript ES6中的简写语法总结与使用技巧
2018/12/30 Javascript
layui table复选框禁止某几条勾选的实例
2019/09/20 Javascript
Vue数据双向绑定底层实现原理
2019/11/22 Javascript
javascript前端实现多视频上传
2020/12/13 Javascript
[37:47]IG vs Winstrike 2018国际邀请赛小组赛BO2 第二场 8.19
2018/08/21 DOTA
python发腾讯微博代码分享
2014/01/10 Python
谈谈Python进行验证码识别的一些想法
2016/01/25 Python
Python unittest模块用法实例分析
2018/05/25 Python
django 多数据库配置教程
2018/05/30 Python
Python数据结构dict常用操作代码实例
2020/03/12 Python
Python2 与Python3的版本区别实例分析
2020/03/30 Python
keras 两种训练模型方式详解fit和fit_generator(节省内存)
2020/07/03 Python
Python Spyder 调出缩进对齐线的操作
2021/02/26 Python
CSS3打造百度贴吧的3D翻牌效果示例
2017/01/04 HTML / CSS
早晨薰衣草在线女性精品店:Morning Lavender
2021/01/04 全球购物
生产车间主管岗位职责
2013/12/28 职场文书
学习党章思想汇报
2014/01/07 职场文书
口才训练演讲稿范文
2014/09/16 职场文书
群众路线自我剖析材料
2014/10/08 职场文书
青年岗位能手事迹材料
2014/12/23 职场文书
公司前台接待岗位职责
2015/04/03 职场文书
办公室年度工作总结2015
2015/05/21 职场文书
详解Redis的三种常用的缓存读写策略步骤
2022/05/06 Redis
Hive导入csv文件示例
2022/06/25 数据库