2011年9月23日 星期五

[CSS]利用css解決Chrome中最小字級12px的問題

設計網頁時,以中文網頁來說,其實往往會混雜著英文在內,有時候若是不將文字轉成圖片,又採用低於12px的字級,這種大小的字級在Chrome中都會強制變成12px。
這是因為Chrome為了避免字體太小看不清楚,所以便在軟體中設定凡是低於12px的文字,就強制設定為12px,以便瀏覽者能清楚的看到內容,這本是一種貼心的設計,但是對設計者來說,反倒會成為一種困擾阿~
上述的問題,壞掉的印表機曾經嘗試在css中設定該字級為font-size:10px;或是用font-size:10px!important來設定,都是無法改變Chrome軟體中字級的強制性,這問題實在讓人頭大。
後來,壞掉的印表機為了解決這個問題,發現只要利用webkit(Chrome的核心),的私有css屬性來解決,我們只要加上下面第一行css碼後設定字級大小,就能解決這個問題了~



在 <body> 的CSS 裡加上這一行即可!

-webkit-text-size-adjust:none;

by 壞掉的印表機 - 設計、生活、態度