背景

chrome為了提升用戶體驗，根據電腦分辨率等條件給瀏覽器設置了默認的最小字號min px，小于這個字號的字體將仍然使用min px顯示

查看chrome瀏覽器最小字號

瀏覽器-->設置(settings)-->高級設置(advanced)-->顯示(Appearence)-->Customise fonts-->Minimum font size

我這里最小字體是10px，因此5px的字體在我的瀏覽器中仍然會顯示為10px

解決方案

<div class="small-name">用戶名 </div> 復制代碼

css部分

.small-name {font-size: 5px; } 復制代碼

將css部分修改為

.small-name {-webkit-transform-origin-x: 0;transform-origin-x: 0;-webkit-transform: scale(0.5);transform: scale(0.5);font-size: 10px; } 復制代碼

這個時候所有chrome瀏覽器都會按照10px的一半，也就是5px來顯示。

小問題

按上面的方案解決之后，會發(fā)現是整個div都縮小了一半，怎么樣使得只有字體縮小呢？

.small-name {width: 200%;-webkit-transform-origin-x: 0;transform-origin-x: 0;-webkit-transform: scale(0.5);transform: scale(0.5);font-size: 10px; } 復制代碼

將寬度設置為原來的兩倍，搞定~

總結

以上是生活随笔為你收集整理的chrome浏览器最小字号解决方案的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。