為什麽chrome不能設置字體小於9px？

chrome瀏覽器中文版不支持12px \ x0d \ x0d \在Chrome 27之前，中文版桌面瀏覽器會默認設置頁面最小字體大小為12px，而英文版則沒有限制，主要是Chrome認為小於12px的漢字會增加識別難度，尤其是中文常用的宋體和微軟雅黑。但在我們的實際項目中，對於數字/英文內容，其他字體的文字可能會對其有特殊要求，需要以較小的字體顯示，所以需要取消瀏覽器的自動調整功能。\x0d\\x0d\壹般的解決方法是禁止webkit瀏覽器配置調整網頁的字體大小。下面的CSS定義:\ x0d \[CSS]viewplancopy \ x0d \。class style {-Webkit-text-size-adjust:none；字體大小:9px}\x0d\\x0d\再來說說text-size-adjust屬性，該屬性用於設置文本大小是否根據設備(瀏覽器)自動調整顯示大小。safari3.0+和chrome1.0+都可以支持。屬性值，可以是三種類型:\x0d\percentage:字體顯示大小；\x0d\auto:默認會根據設備/瀏覽器自動調整字體大小；\x0d\none:不會自動調整字體大小\x0d\\x0d\據說這個屬性最初是專門為iPhone版safari設計的，用來自動調整iPhone上普通網頁的字體顯示。但是，由於它是webkit的私有屬性，所以在帶有webkit內核的桌面瀏覽器中經常使用它來限制頁面顯示。其實這是webkit中的壹個bug。最新版本的Chrome已經修復。\x0d\\x0d\需要註意的是，不合理的使用-webkit-text-size-adjust:none會造成很多不好的影響。舉個例子，如果定義為全局屬性，當用戶在Chrome中放大縮小頁面時(在PC上按住Ctrl並滾動鼠標滾輪可以放大頁面)，文本保持定義的大小不縮小，給用戶帶來不太友好的體驗。所以我們在使用的時候，最好定義為局部有效，而不是為了省事說html {-Webkit-text-size-adjust:none；}克服它。\x0d\\x0d\由於沒有-o-text-size-adjust這樣的CSS屬性，在Opera中，我們只能自己手動設置:Tools-& gt；首選項-& gt；高級-& gt；字體-& gt；最小字體大小(像素)。\ x0d \ \ x0d \ Chrome27 for PC desktop正式取消了對-webkit-text-size-adjust屬性的支持，實際上修正了原來的bug。如果定義了這個屬性，那麽Chrome調試窗口中就會顯示Unknownpropertyname，所有字體大小都應該至少是12px。但是，移動chrome/safari仍然支持-webkit-text-size-adjust屬性。因為這個屬性的濫用會讓webkit內核的瀏覽器失去調整能力，對視障瀏覽器(尤其是移動終端)非常不友好，那麽現在如何實現原來的要求呢？\x0d\我們可以嘗試通過對文本區域部分應用以下樣式來解決此問題:\ x0d \ x0d \[CSS]viewplancopy \ x0d \。chrome _ adjust { \ x0d \ font-size:9px；\ x0d \-WebKit-transform:scale(0.75)；\ x0d \ } \ x0d \ \ x0d \ 12×0.75 = 9。對於其他瀏覽器，12px以下的字體大小是可以識別的，這裏我們只需要對Chrome瀏覽器進行縮放即可。但是沒有有效的CSShack來分辨是Safari還是Chrome。可以通過javascript判斷是不是Chrome。判斷方法:varichrome =！！windows . chrome；當它被檢測為Chrome時，添加該類。chrome_adjust對應的標簽。\ x0d \ x0d \但是，問題還沒有解決。看到網頁在三種瀏覽器中的不同表現:\x0d\1)，因為Chrome下啟用了縮放，所以字符間距有問題，影響外觀。這個時候，如果妳追求完美，妳甚至會想到js判斷為Chrome，然後用CSS屬性字母間距來修復；\x0d\2)，Firefox不知道-webkit，所以表現正常，9px；\x0d\\x0d\3)，Opera12.5+可以識別-webkit-前綴(Opera12.15版本，內核還沒改成webkit，但是可以識別-WebKit-前綴，檢查元素時擦除)，但是也可以顯示。結果是9×0.75，影響肉眼識別。此時，opera中必須添加-o-transform:scale(1)。這個屬性。\ x0d \ \ x0d \[CSS]viewplancopy \ x0d \。chrome _ adjust { \ x0d \ font-size:9px；\ x0d \-WebKit-transform:scale(0.75)；\ x0d \-o-transform:scale(1)；//為可以識別的operabrowser設置\ x0d \ } \ x0d \ x0d \ WebKit。其實來自挪威的Opera壹直都是用自己的引擎(Presto)，但是經常會造成壹些所謂的“兼容性問題”。在越來越多的網站針對WebKit進行優化的情況下，Opera的對策是引入WebKit引擎的壹些前綴屬性，避免開發者因為網頁屬性的選擇而影響Opera的功能。Opera12.50將是其首款支持Webkit屬性的桌面瀏覽器，包括-webkit-linear-gradient和-o-linear-gradient。移動版本也將使用相同的核心。相關測試的開發者可以下載模擬器Opera Mobile Emulator-Windows、Linux和Mac版本。