谷歌浏览器(Google Chrome)不支持小于12px字体的问题解决

今天在公司测试Magento模版的兼容性时发现了一个问题 - 谷歌浏览器(Google Chrome)不支持小于12px字体？！其实在做前几个项目的时候在测试浏览器兼容性的时候有发现过这个问题。当时没有太在意，因为没有错乱的问题。今天由于在CSS设置的大小是10px，且父级DIV宽度也刚好只能容纳10px大小的字体宽度。所以在谷歌浏览器里就错乱了。这还了得，不得被客户劈死。得想办法解决呐！正好前几天加了个群 - WEB前端开发群3。于是乎在群里吼了两声，立马有高手回答，怕忘记就顺便记录下来。在此感谢群里的大虾们！

谷歌浏览器默认最小字体为12px，小于12px的字体它都以12px显示，有时我们需要字体小点，特别是在制作英文网站时，所以很蛋疼。不过还是有解决方案的。看下面：

• 在html或者body里添加一句谷歌浏览器专有的属性。

  html,body{
        -webkit-text-size-adjust:none;
  }

  注意：如果使用了这个属性，浏览器的字体将不能使用放大缩小功能！（就是按住CTRL键上下滚动鼠标中键的那功能）

• 
  Google Chrome 下字体无法正常缩放大小
  
  
  

还有朋友说用em(字符)作为单位定义字体大小有用。本人亲自测试过，用em字义的字体在谷歌浏览器中最小也不会小于12px。所以是没用的。暂时我只知道上面一种方法，如果谁有其它方法记得分享哦。