剛接到廣告公司出的設計稿，裡面很多內容均是12px以下得字型，現在來總結一下解決辦法，方便以後使用
1.使用png 但是會影響頁面響應速度
2.使用transform: scale(0.x);
注意此時文字容器 必須是可以設定寬高的,即display屬性 必須是inline-block或block
計算公式：12px * 0.75（縮放比例） = 9px
font-size: 9px;就會出現如圖效果 12px 和9px 的字型對比display: block;
transform: scale(0.75);
-webkit-transform: scale(0.75);
-moz-transform: scale(0.75);
-o-transform: scale(0.75);
由於原理上還是放大縮小 所以字型位置可能會改變 這時候還要加乙個屬性
-webkit-transform-origin-x: 0;備註 ie7，ie8不相容
.font9
讓Chrome顯示12px以下的字型
一般情況下，chrome無法顯示12px以下的字型 凡是小於12px，均以12px來顯示。此時需要設定強制顯示，以顯示10px為例 以12px為單位，10px 12px 0.8333333333333334 在文字所在div等樣式中加入下式即可 webkit transform scale 0.83...
論低於 12px 字型處理方案
瀏覽器可渲染的最小字型大小為 12px，但設計圖上經常出現小於該值的字型。對於 11px 我往往就按 12px 處理了，可 9px 這樣的超小字號處理成 12px 絕對太不地道啊。大家可能都知道通過 transform scale n 能達到縮小字型的效果，但你沒有發現並非十分好用？第乙個例子 看到...
谷歌瀏覽器小字型處理方案即12px以下字型
谷歌程式設計客棧瀏覽器是不支援12px以下小字型的，可能是考慮到使用者體驗吧。複製www.cppcns.com 如下 webkit text size adjust none 程式設計客棧 但是，lwxom自chrome 27之後，就取消了對這個屬性的支援。我們還有其它辦法解決這個問題嗎？谷歌瀏覽器...