JAVA高级面试进阶训练营视频教程

admin

当我们设置前台html页面样式问题字体小于12px;时，会发现不管怎么设置小于12px字体，在谷歌、360浏览器上都不生效。

但在火狐等浏览器上却可以正常设置，当你打开谷歌360的设置后会发现，它们设置的默认最小字体为12px，若小于12px

即不会生效（真坑，但坑有坑的解决办法）。如图所示：

解决办法：

既然最小支持到12px，那么就以12px为基点进行缩放，即可以使用到 css3里的一个属性：transform:scale(n),n为放大倍数。

具体步骤如下：

<style>
    .a{font-size:10px;-webkit-transform:scale(0.8);}/*0.8为缩放的比例大小*/
    .b{font-size:8px;}
</style>

<span class="a">
    <span class="b">我就是要比12px小</span>
</span>

 

细心的你会发现，我上面代码中写了两个<span>,又对里层的<span>定义了一个class类b,并设置字体大小为想要的大小，其作用是作用于非谷歌，360浏览器的字体大小。

错误之处，还望指正！