Chrome瀏覽器最小字體12px限制問題解決方法

問題描述：

　　頁面寬度有限的情況下顯示大數據，采用font-size：8px來壓縮字體大小，版本 25.0.1547.66及以下版本的chrome瀏覽器沒有問題，后續版本的就不可以了；

問題原因：

　　瀏覽器設置了最小字體限制；配置文件在"Documents and Settings\User_Name\Local Settings\Application Data\Google\Chrome\User Data\Default\Preferences"，內容如下：　　

"webkit" : {
    "webprefs" : {
        "default_fixed_font_size" : 11,
        "default_font_size" : 12,
        "fixed_font_family" : "Bitstream Vera Sans Mono",
        "minimum_font_size" : 12,
        "minimum_logical_font_size" : 12,
        "sansserif_font_family" : "Times New Roman",
        "serif_font_family" : "Arial",
        "standard_font_is_serif" : false,
        "text_areas_are_resizable" : true
    }
}

所以當設置了小於12px的字體是無效的；

歷史解決方案：

　　經查詢以前大家經常用-webkit-font-size-adjust:none;新版瀏覽器已不再支持該屬性；有人還提出了用css3中的-webkit-transform:scale(num),其中num是設置的字體大小/12px,如font-size:8px,則num=8/12=0.67，不過這種方法雖然可以實現小字體，但是字體仍然“占位”即占據大字體的位置只是縮小了字體；

現在的解決方案：　　

　　配合html，-webkit-transform:scale(num)來解決問題。

<td class=" ft8" title="289"><em>289</em></td>

.ft8 {
font-size: 8px;
font-family: Arial;
}
.ft8 em {
display: inline-block;
width: 10px;
height: 10px;
-webkit-transform: scale(0.7,0.7);
}

ft8父級樣式來定位需要變換的元素的"流"，ft8 em來設置變換，這樣就可以了。