? ? ? 谷歌瀏覽器默認(rèn)最小字體為12px，小于12px的字體它都以12px顯示，具體效果見(jiàn)下圖。有些特殊情況下我們需要字體小點(diǎn)，特別是在制作英文網(wǎng)站的時(shí)候，怎么辦？既然有問(wèn)題，我們就有解決問(wèn)題的方法。

<p>xjun0812測(cè)試16像素</p> <p>xjun0812測(cè)試14像素</p> <p>xjun0812測(cè)試12像素</p> <p>xjun0812測(cè)試10像素</p> <p>xjun0812測(cè)試10像素</p>
? ? ??IE等瀏覽器效果如下：

? ? ??Chrome瀏覽器下的效果：

? ? ??在網(wǎng)上有一個(gè)方法就是在html或者body里添加一句谷歌瀏覽器專有的屬性。

? ? ??html,body{ -webkit-text-size-adjust:none; }

? ? ??可是我用了之后發(fā)現(xiàn)并沒(méi)有什么用，原來(lái)在新版本的谷歌瀏覽器里已經(jīng)無(wú)效。那么我們現(xiàn)在應(yīng)該怎么辦呢？

? ? ??我們可以使用CSS3的一個(gè)縮放屬性：transform:scale()，我這里給最后一行設(shè)置的代碼如下（倒數(shù)第二行不做任何其他設(shè)置，以做參考）：

-webkit-transform:scale(0.833); /*這個(gè)數(shù)字0.833，是縮放比例，可以根據(jù)你自己的情況不同而不同。*/
? ? ??從上圖可以看到最后一行是變小了，但是左邊卻出現(xiàn)了留白。是因?yàn)樽隹s放處理的時(shí)候把寬度也縮放了。還有要注意一點(diǎn)，如果這個(gè)<p>元素有背景的話，也會(huì)使背景也隨著變化，所以，我們通常的做法是給<p>標(biāo)簽里再套個(gè)一個(gè)標(biāo)簽，我這里用<span>標(biāo)簽。

<p>xjun0812測(cè)試16像素</p> <p>xjun0812測(cè)試14像素</p> <p>xjun0812測(cè)試12像素</p> <p>xjun0812測(cè)試10像素</p> <p><span>xjun0812測(cè)試10像素</span></p>

? ? ??你會(huì)發(fā)現(xiàn)現(xiàn)在反而沒(méi)有效果了，如圖：

? ? ??這是因?yàn)閠ransform:scale()這個(gè)屬性只為可以縮放可以定義寬高的元素，而span是行內(nèi)元素；我們給span元素定義一個(gè)display:block,這樣就可以了。

? ? ??我們會(huì)發(fā)現(xiàn)一個(gè)問(wèn)題，不管span元素是否左浮動(dòng)，還是會(huì)發(fā)現(xiàn)左邊出現(xiàn)了留白，我們可以通過(guò)設(shè)置寬度等其他辦法來(lái)解決，結(jié)果如下：

? ? ??最后，因時(shí)間倉(cāng)促，資質(zhì)有限，文中表述僅代表個(gè)人觀點(diǎn)，如果有更好的方法，歡迎留言。

總結(jié)

以上是生活随笔為你收集整理的Chrome浏览器不支持字体小于12px的解决办法的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。