css 让chrome支持小于12px的文字

问题描述：

chrome浏览器限制了文字的大小，最小只能是12px，以前可以使用Chrome的CSS私有属性-webkit-text-size-adjust:none; （只对英文才有效，对中文无效。）来取消Chrome的字体限制。但是，在chrome更新到27版本之后就删除了这个属性。

如图所示：

问题解决

1.利用transform属性来解决这个问题


但是这里会发现，虽然字体改变了，但是位置也发生了变化，这是因为transform:scale()只能对块元素设置，设置后宽高也会比例缩放，transform属性影响了宽高，对布局产生了影响，这里我们利用translate方法可以改变它的位置