chrome浏览器字体小于12px的解决方式

(1)    使用webkit的内核-webkit-text-size-adjust的私有属性解决,样式定义如下:   .el{-webkit-text-size-adjust:none;font-size:10px;} 只要加了-webkit-text-size-adjust:none;字体大小就不受限制了,但是,在chome更新到27版本之后就不可用了。
(2)    将文字做在图片上
(3)    使用-webkit-transform:scale(0.75);
在样式中添加:
.el{
font-size:9px;
display:block; 
-webkit-transform-origin-x: 0;   //X方向上缩放的中心点
-webkit-transform:scale(0.75);   /*12*0.75=9   缩放比例*/
transform:scale(0.75); 
width:300px;
    注意:在使用的使用,这种方法需要提前计算好文字的宽度,然后按比例进行缩放。例如.el原本宽度为225px,在经过缩放的时候需要将宽度设为300px(300*0.75=225),这样才能保证原本的宽度不变。
}

 

posted @ 2018-06-28 11:03  爽朗琴天  阅读(190)  评论(0)    收藏  举报