Chrome如何设置10px字体

一、不同浏览器的字体限制

平台	浏览器	默认最小字体	最小字体限制
Mac	Chrome	12px	6px
Mac	Safari	0px	no
Mac	Firefox	0px	no
Win	Chrome	12px	6px
Win	IE11	0px	no
Win	Edge	0px	no
Win	Firefox	0px	no
Mobile	Webkit	12px	12px

【注】虽然谷歌浏览器可以通过手动修改设置最小到6px，但是对于普通用户来说并不会进行设置。所以要通过其他的手段实现10px

二、PC浏览器制作10px的字体

.font10px {
    font-size: 12px;
    transform : scale(.833);
    /*transform-origin:left center*/
    *font-size: 10px;
  	/*
  	也可以将20px缩放一半
  	font-size:20px;
         transform : scale(.5);
         *font-size : 10px;
  	*/
}

我们要根据文本的位置设置缩放中心：

如果文本是居中的，那么不需要设置缩放中心。

如果文本是左对齐的，那么就需要设置缩放中心为文本左边。

*font-size:10px是兼容低版本IE【由于低版本ie不支持transform，所以该类对低版本IE来说就相当于只设置了两个字号。】

三、移动端浏览器制作10px字体

由于 Mobile 端绝大多数浏览器采用的是 Webkit 内核，我们只需要设置-webkit-text-size-adjust: 100%;，这样一来就可以在 Webkit 浏览器中设置任意大小的字了。

四、其他方式

• 图片
• 自制字体
• SVG

---

新人浅见，敬请指摘