使用rem时chrome中的bug

问题:当根节点html的字体大小设置小于12px时,chrome始终使用12px计算rem的值

原因:chrome的字体最小大小为12px,不能再小了

解决办法1:chrome 27.0版本以下可通过给html加-webkit-text-size-adjust:none;属性来解决,但是之后的版本都不支持了,新版本已经禁止了改属性

办法2:用css3的transform:scale(0.875);  (PS: 绝对是馊主意,字体和容器都跟着一起缩小了)

最终选择:向chrome妥协了,把根节点的字体改成大于12重新计算了所有的大小,谁让你的我的最爱呢,允许你有一点点小任性。


附:cssrem的工具 (有了它重新计算rem距离和大小会方便很多,表情:阴笑)



你可能感兴趣的:(前端)