关于一写浏览器识别不了12px以下的样式的解决方法

时间：2020-03-13 17:33:58 阅读：79 评论：0 收藏：0 [点我收藏+]

因为有的浏览器的最小字体只能识别到12px，就比如说google浏览器，这个时候我们把大小写成它的两倍，然后用transform:scale()的方式缩放回之前的大小就可以解决这个问题

例如：某oppo手机和google浏览器下的效果：

该图标是用iconfont实现的，给的样式如下

i {
　　font-size: .12rem;  // 6px 识别不了小于12px的字体大小
　　line-height: 1.2em;
}

技术分享图片

理想效果是这样的:

例如：filefox浏览器下的效果：

和改完bug之后google浏览器下的效果：

技术分享图片

改完之后的代码：

i {
    font-size: 0.24rem; // 用它的2倍
    line-height: 0.16rem;
    transform: scale(0.5); // 用transform缩小到原来的样式
}

原文：https://www.cnblogs.com/Awen71815iou/p/12487510.html

踩

(0)

评论一句话评论（0）

分享档案

更多>