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

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

Chrome 27之前的中文版桌面浏览器会默认设定页面的最小字号是12px,英文版则没有限制,主要是因为chrome认为汉字小于12px就会增加识别难度,尤其是中文常用的宋体和微软雅黑。而我们在实际项目中,对于数字/英文内容,其他字体的文本可能会有特殊的需求要求它们以更小的字号来显示,这个时候就需要取消浏览器的自动调整功能了。

一般解决方案是禁止webkit浏览器配置调整网页的字体大小。如下CSS定义方式:

  1. .classstyle{ -webkit-text-size-adjust:none; font-size:9px; }  
  2. 需要注意的是,不合理的使用-webkit-text-size-adjust:none会造成许多不好的影响。比如将其定义为全局属性的话,在Chrome中当用户放大缩小页面(PC上按住Ctrl滚动鼠标滚轮可缩放网页)的时候,文字却维持定义的大小而不放缩,给用户带来的不太友好的体验。所以我们在使用时,最好定义为局部有效,而不要图省事一句html{-webkit-text-size-adjust:none;}了事。
可以通过javascript来判断是否为Chrome。判断方法:var isChrome = !!window.chrome;当检测为Chrome的时候,将.chrome_adjust这个类添加到对应的标签。
.chrome_adjust {  
    font-size: 9px;  
    -webkit-transform: scale(0.75);  
    -o-transform: scale(1);    //针对能识别-webkit的opera browser设置  
} 

 

 
 

posted on 2016-06-13 17:37  kingplus  阅读(230)  评论(0编辑  收藏  举报

导航