CSS 解决 Chrome 限制最小12px字号问题

在 PC 上，有的时候我们并不需要 Chrome 给我们限定 12px 的最小字号，可是我们也不可能强行要求用户人工设置一波（当年 CodeCademy 的 Bug 就是因为最小字号的问题），所以必须想办法。

旧版 Chrome 可以通过：-webkit-text-size-adjust:none来设置，但其实是利用了一个微小的 Bug，在新版已经修复了，此外，这种方法会导致全局的缩放失效，不够友好。

在新版中，可以用 scale 解决缩放的问题，但如果是：-webkit-transform: scale(0.75);，Safari 也在缩放范围内，有两个方法解决：

第一是所有的浏览器统一的使用缩放，在 12px 的基础上操作。

第二是针对 Chrome 进行 hack。

当然可能有些表现差异，缩放以中心为原点进行等比例缩放，而字体的缩小没有改变位置，所以布局上前者更统一。

后者的 hack 也可以补足，但是 hack 虽好，还是要慎用，以下这段代码据说是 Chrome 的 hack（也可以反向思维用 Safari 的 Hack 填坑），更多方法见参考链接：

@media all and (-webkit-min-device-pixel-ratio:0) and (min-resolution: .001dpcm) {
    #selector {
        background: red;
    }
}

参考链接：

1. 中文版Chrome浏览器不支持12px以下字体的解决方案
2. Is there a Google Chrome-only CSS hack?