首页前端开发HTML谷歌浏览器小字体处理方案即12px以下字体

谷歌浏览器小字体处理方案即12px以下字体

时间2024-01-24 10:01:33发布访客分类HTML浏览840
导读:收集整理的这篇文章主要介绍了谷歌浏览器小字体处理方案即12px以下字体,觉得挺不错的,现在分享给大家,也给大家做个参考。 谷歌浏览器是不支持12px以下小字体的,可能是考虑到用户体验吧。 网上也有一些文章介绍,说可以使用: 复制代...
收集整理的这篇文章主要介绍了谷歌浏览器小字体处理方案即12px以下字体,觉得挺不错的,现在分享给大家,也给大家做个参考。 谷歌浏览器是不支持12px以下小字体的,可能是考虑到用户体验吧。
网上也有一些文章介绍,说可以使用:

复制代码代码如下:
-webkit-text-size-adjust:none;

但是,自chrome 27之后,就取消了对这个属性的支持。

我们还有其它办法解决这个问题吗?

谷歌浏览器支持CSS缩放,于是,我们可以在这方面做文章:

复制代码代码如下:
-webkIT-transform: scale(0.5);

既然最小支持到12px,那么就以12px为基点进行缩放,

同时可以使用-webkit-transform-origin-x: 0; 来解决缩放后margin-left的位移问题:

复制代码代码如下:@H_512_47@
.test_tag{
font-Size:12px;
-webkit-transform-origin-x: 0;
-webkit-transform: scale(0.5833333333333334);
}

scale值的计算方法为: 7 / 12 = 0.5833333333333334

声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!

谷歌浏览器

若转载请注明出处: 谷歌浏览器小字体处理方案即12px以下字体
本文地址: https://pptw.com/jishu/585281.html
html5教程画矩形代码分享 利用html5的websocket实现websocket聊天室

游客 回复需填写必要信息