-
不支援小於12pxCSS樣式目錄
-
- 問題分析
- Google瀏覽器支援font-size小字型方法
- 解決所需CSS代碼
- 解決前後
- 未解決前HTML+CSS代碼
- 解決後HTML+CSS代碼
- 掌握解釋
1、Google瀏覽器不支援設定CSS較小字型問題分析 - TOP
網頁常常為了排版美觀,會使用忽大或小的文字,通常font-size文字為12px(像素)文字。設定大於12px文字字型,各瀏覽器都能顯示出CSS所設定文字大小效果。但是CSS設定小於12px文字時候Google瀏覽器google Chrome就不能顯示出CSS所設定小於12px的文字字型效果。
2、Google瀏覽器支援設定font-size小於12px像素解決方案: - TOP
Google瀏覽器預設最小字型為12px,小於12px的字型它都以12px顯示,有時我們需要字型小點,特別是在製作英文網站時,常常使用CSS樣式顯示小於12px文字,這樣Google瀏覽器就不能顯示所設定較小的文字。不過還是有解決方案的。
3、解決所需CSS代碼 - TOP
在html或者body裡添加一句Google瀏覽器專有的核心屬性樣式(或者在需要設定小文字字型對象CSS選取器添加也可)如下CSS代碼:
html,body{-webkit-text-size-adjust:none;}
或
.divcss5{-webkit-text-size-adjust:none;}
註:如果使用了這個屬性,瀏覽器的字型將不能使用放大縮小功能!(就是按住CTRL鍵上下滾動滑鼠中鍵的那功能)
嘗試換單位-無用:
還有朋友說用em(字元)作為單位定義字型大小有用。本人親自測試過,用em字義的字型在Google瀏覽器中最小也不會小於12px。所以是沒用的。暫時我只知道上面一種方法
4、設定小字型後瀏覽器對比圖 - TOP
Google瀏覽器關於font-size字型小於12像素對比圖
HTML+CSS代碼前後局部代碼:
5、設定前HTML+CSS代碼: - TOP
6、設定CSS樣式後DIV+CSS代碼: - TOP
7、掌握與總結: - TOP
Google瀏覽器Chrome是Webkit的核心,有一個 -webkit-text-size-adjust 的私人 CSS 屬性,通過它即可實現字型大小不隨終端裝置或瀏覽器影響。
CSS樣式定義如下:
-webkit-text-size-adjust:none;
關於Google瀏覽器顯示CSS樣式設定字型大小問題終於塵埃落定,這樣以來其他瀏覽器也不會因為此CSS樣式屬性而受影響。