「每日一題」為什麼不建議將 font-size 設置為 12px 以下？

先看看把 font-size 設置為 12px 以下時的效果：（瀏覽器為 Chrome 52）

在其他瀏覽器上效果卻不一樣：

因為 Chrome 這款任性的瀏覽器做了如下限制：

1. font-size 有一個最小值 12px（不同操作系統、不同語言可能限制不一樣），低於 12px 的，一律按 12px 顯示。理由是 Chrome 認為低於 12px 的中文對人類是不友好的。

2. 但是允許你把 font-size 設置為 0.

3. 這個 12px 的限制用戶是可以自行調整的，進入 chrome://settings/fonts 設置，滾動到最下方你就可以調整 12px 為其他值。

如果我一定要設置小於 12px 的字體怎麼辦？

1. Chrome 29 版本之前，你可以使用 `-webkit-text-size-adjust: none;` 來解除這個限制。29 版本後，就不能這樣做了。

2. 你可以先設置 12px，然後使用 transform: scale(0.833333) 將元素縮小，效果跟 10px 很接近。不過要注意的是，transform: scale 出了縮小 font-size，也會縮小其他一些屬性，需要多測試。

好了，今天的分享就到這裡，想要更多交流可以加我們的前端交流3群：222459918，目前已有四百多人。

推薦閱讀：