html中文字最小字号,针对谷歌默认最小字体12px的正确解决方案 （css、html）

产品要求把以前12px的字体改小一点，我心想这有什么难的，就随口答应了。哪知，，谷歌浏览器中font-size小于12px时，字体就不会再缩小了。于是，只有百度了，原来谷歌以及谷歌内核的浏览器在中文语言下最小字体只能是12px。不管那么多了，反正要解决这个问题呀~既然这是一个经典的兼容性问题，一定有很多解决方法吧。让人吃惊的是，再百度一伙，网上所有的解决方案都惊奇地相似：

html{

-webkit-text-size-adjust:none;

}

然后我满心欢喜地用上去之后，发现并没有什么鸟用。再后来，又查了下资料了解到在chrome

27之后，就取消了对这个属性的支持。尼玛，这不是坑爹吗？柳暗花明又一村，然后发现了另一种解决办法：

.small-font{

font-size:

12px;

-webkit-transform-origin-x:

0;

-webkit-transform:

scale(0.90);

}

利用css3的缩放，其最终大小就是：12px * 0.9(缩放比例) = 10.8px;

居然行得通。但回头一想，这么写的话，IE7

IE8会不会不兼容，还是12px呢？不出所料，果然不兼容。此时，又回头一想，要不再加个样式font-size？试了一下，果然兼容谷歌，IE7，IE8，代码如下：

.small-font{

font-size:12px;

-webkit-transform-origin-x:

0;

-webkit-transform:

scale(0.90);

}

.smallsize-font {

font-size:10.8px;

}

温馨提示：