问题描述:

  页面宽度有限的情况下显示大数据,采用font-size:8px来压缩字体大小,版本 25.0.1547.66及以下版本的chrome浏览器没有问题,后续版本的就不可以了;

问题原因:

  浏览器设置了最小字体限制;配置文件在"Documents and Settings\User_Name\Local Settings\Application Data\Google\Chrome\User Data\Default\Preferences",内容如下:  

"webkit" : {
"webprefs" : {
"default_fixed_font_size" : 11,
"default_font_size" : 12,
"fixed_font_family" : "Bitstream Vera Sans Mono",
"minimum_font_size" : 12,
"minimum_logical_font_size" : 12,
"sansserif_font_family" : "Times New Roman",
"serif_font_family" : "Arial",
"standard_font_is_serif" : false,
"text_areas_are_resizable" : true
}
}

所以当设置了小于12px的字体是无效的;

历史解决方案:

  经查询以前大家经常用-webkit-font-size-adjust:none;新版浏览器已不再支持该属性;有人还提出了用css3中的-webkit-transform:scale(num),其中num是设置的字体大小/12px,如font-size:8px,则num=8/12=0.67,不过这种方法虽然可以实现小字体,但是字体仍然“占位”即占据大字体的位置只是缩小了字体;

现在的解决方案:  

  配合html,-webkit-transform:scale(num)来解决问题。

<td class=" ft8" title="289"><em>289</em></td>
.ft8 {
font-size: 8px;
font-family: Arial;
}
.ft8 em {
display: inline-block;
width: 10px;
height: 10px;
-webkit-transform: scale(0.7,0.7);
}

ft8父级样式来定位需要变换的元素的"流",ft8 em来设置变换,这样就可以了。

												

Chrome浏览器最小字体12px限制问题解决方法的更多相关文章

  1. chrome 浏览器最小字体为12px 的解决办法

    http://banri.me/web/webkit-text-size-adjust.html 对div进行缩放 12*0,75 = 9 px -webkit-transform: scale(0. ...

  2. 浏览器最小显示12px字体的解决方法

    今天做打印标签,发现浏览器最小字体限制了12px,标签那么小,12px随便几个字就给占满了: 最后通过  transform:scale(1,0.8) 搞定: 这个属性允许将元素移动.压缩.旋转:这里 ...

  3. 中文版Chrome浏览器不支持12px以下字体的解决方案

    中文版Chrome浏览器不支持12px以下字体的解决方案 Chrome 27之前的中文版桌面浏览器会默认设定页面的最小字号是12px,英文版则没有限制,主要是因为chrome认为汉字小于12px就会增 ...

  4. chrome不支持字体12px

    如果网页字体小于12px的话,人眼看着会不太舒服,所以chrome的最小字体为12px. 如果想要缩小字体,可以尝试用CSS3中的 transform: scale(相应的缩小倍数)来实现. 不过不推 ...

  5. html{-webkit-text-size-adjust:none;}(取消浏览器最小字体限制)

    2016年10月13日 09:31:58 ITzhongzi 阅读数 9409   1.当样式表里font-size<12px时,中文版chrome浏览器里字体显示仍为12px,这时可以用 ht ...

  6. 浅谈配置chrome浏览器允许跨域操作的方法

    浅谈配置chrome浏览器允许跨域操作的方法 一:(Lying人生感悟.可忽略) 最近有一天,对着镜子,发现满脸疲惫.脸色蜡黄.头发蓬松.眼神空洞,于是痛诉着说生活的不如意,工作没激情,工资不高,一个 ...

  7. chrome浏览器下的xdebug helper使用方法

    chrome浏览器下的xdebug helper使用方法     自从安装了xdebug后,发现每次调试都需要从eclipse中先从头启动,然后一步步走到你要调试的页面,而不是说想什么时候调试就什么时 ...

  8. 亲历谷歌 Chrome 浏览器弹窗境外广告的解决方法(图) | 技术乐园

    亲历谷歌 Chrome 浏览器弹窗境外广告的解决方法(图) | 技术乐园 转 https://www.hack520.com/338.html 谷歌的 Chrome 浏览器是我非常喜欢的一款的浏览器, ...

  9. 针对谷歌默认最小字体12px的正确解决方案 (css、html)

    今天晨会,产品要求把以前12px的字体改小一点,我心想这有什么难的,就随口答应了.哪知,改css的时候,谷歌浏览器中font-size小于12px时,字体就不会再缩小了.当时我的第一反应就是会不会是其 ...

随机推荐

  1. jQuery—$让渡

    方法1:(取别名) 方法2:(指定作用域) 场景用例: 解决方案:方法1(取别名) 解决方案:方法2(指定作用域)

  2. Redis持久化及复制

    一.持久化的两种方式 1.RDB: RDB是在指定时间间隔内生成数据集的时间点快照(point-in-time snapshot)持久化,它是记录一段时间内的操作,一段时间内操作超过多少次就持久化.默 ...

  3. 斐讯面试记录—三线程交替打印ABC

    package cn.shenzhen.feixun; public class PrintABC extends Thread{ private String name; private Objec ...

  4. TabLayout与ViewPager同步后Tab的标题不显示

    一.概述 1.1 问题描述 TabLayout+ViewPager后,TabLayout的TabItem不显示的问题: 1.2 截图 二.结论 mTabs.setupWithViewPager(mVi ...

  5. 2017 Multi-University Training Contest - Team 3 hdu6060 RXD and dividing

    地址:http://acm.split.hdu.edu.cn/showproblem.php?pid=6060 题目: RXD and dividing Time Limit: 6000/3000 M ...

  6. ACM-ICPC 2018 南京赛区网络预赛 - L Magical Girl Haze (分层迪杰斯特拉)

    题意:N个点,M条带权有向边,求可以免费K条边权值的情况下,从点1到点N的最短路. 分析:K<=10,用dist[i][j]表示从源点出发到点i,免费j条边的最小花费.在迪杰斯特拉的dfs过程中 ...

  7. 某个php爬虫程序分析--来自wooyun

    乌云漏洞编号: WooYun-2014-68061 作者:hkAssassin 爬虫程序源码: <?php header("content-type:text/html;charset ...

  8. JVM(3) 垃圾回收器与内存分配策略

    文章内容摘自:深入理解java虚拟机 第三章   对象已死? 1. 引用计数算法: 给对象中添加一个引用计数器,每当有一个地方引用它时,计数器值就加1:当引用失效时,计数器值就减1:任何时刻计数器为0 ...

  9. GIT使用—补丁与钩子

    一.补丁 生成补丁 [root@localhost buding]# echo B > file;git add file;git commit -m "B" [master ...

  10. 基于tomcat集群做session共享

    前端代理服务器nginx:192.168.223.136 tomcat服务器:采用的一台多实例192.168.223.146:8081,192.168.223.146:8082(如何构建多实例tomc ...