谷歌浏览器小字体处理方案即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.0 图形构成实例练习二
Mar 19 HTML / CSS
CSS Grid布局教程之什么是网格布局
Dec 30 HTML / CSS
css 元素选择器的简单实例
May 23 HTML / CSS
谈谈对css属性box-sizing的了解
Jan 04 HTML / CSS
CSS3 实现的缩略图悬停效果
Dec 09 HTML / CSS
突破canvas语法限制 让他支持链式语法
Dec 24 HTML / CSS
HTML5新增加标签和功能概述
Sep 05 HTML / CSS
HTML5 canvas 瀑布流文字效果的示例代码
Jan 31 HTML / CSS
Html5页面中的返回实现的方法
Feb 26 HTML / CSS
解决html5中的video标签ios系统中无法播放使用的问题
Aug 10 HTML / CSS
HTML5 canvas实现的静态循环滚动播放弹幕
Jan 05 HTML / CSS
CSS3新特性详解(五):多列columns column-count和flex布局
Apr 30 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令牌 Token改进版
2008/07/18 PHP
用php来改写404错误页让你的页面更友好
2013/01/24 PHP
php下获取http状态的实现代码
2014/05/09 PHP
Laravel执行migrate命令提示:No such file or directory的解决方法
2016/03/16 PHP
iOS+PHP注册登录系统 PHP部分(上)
2016/12/26 PHP
PHPTree――php快速生成无限级分类
2018/03/30 PHP
jQuery实现延迟跳转的方法
2015/06/05 Javascript
JS+CSS简单树形菜单实现方法
2015/09/12 Javascript
ashx文件获取$.ajax()方法发送的数据
2016/05/26 Javascript
bootstrap实现图片自动轮播
2016/12/21 Javascript
Bootstrap3 多选和单选框(checkbox)
2016/12/29 Javascript
JavaScript实现经纬度转换成地址功能
2017/03/28 Javascript
vuejs数据超出单行显示更多,点击展开剩余数据实例
2019/05/05 Javascript
js实现图片无缝循环轮播
2019/10/28 Javascript
js实现拖动缓动效果
2020/01/13 Javascript
适用于 Vue 的播放器组件Vue-Video-Player操作
2020/11/16 Javascript
python 正则式使用心得
2009/05/07 Python
python类继承与子类实例初始化用法分析
2015/04/17 Python
详细解读Python中的__init__()方法
2015/05/02 Python
全面了解python字符串和字典
2016/07/07 Python
值得收藏的10道python 面试题
2019/04/15 Python
Python将主机名转换为IP地址的方法
2019/08/14 Python
pytorch 获取tensor维度信息示例
2020/01/03 Python
Python用摘要算法生成token及检验token的示例代码
2020/12/01 Python
CSS3 选择器 属性选择器介绍
2012/01/21 HTML / CSS
美国蔬菜和植物种子公司:Burpee
2017/02/01 全球购物
制定岗位职责的原则
2013/11/08 职场文书
大学生村官典型材料
2014/01/12 职场文书
人力资源总监工作说明
2014/03/03 职场文书
英语演讲稿3分钟
2014/04/29 职场文书
社区精神文明建设汇报材料
2014/08/17 职场文书
爱心捐款活动总结
2015/05/09 职场文书
python引入其他文件夹下的py文件具体方法
2021/05/23 Python
python图片灰度化处理的几种方法
2021/06/23 Python
电脑只能进入安全模式无法正常启动的解决办法
2022/04/08 数码科技
Python使用mitmproxy工具监控手机 下载手机小视频
2022/04/18 Python