html5 - 在移动端设置font-size小于12px。line-height的问题

Question

正如标题所说，比如我在一个标签内设置font-size：10px，那么他的line-height就默认为16px了，在设置line-height：10px是不生效的，设置line-height大于12px的时候就生效了，ios上没问题，这是什么情况啊。。。有解决办法没

Answer 1

當樣式表裡font-size<12px時，chrome瀏覽器裡字型顯示仍為12px，這時可以用 html{-webkit-text-size-adjust:none;}

Answer 2

chrome之前是不支援12px以下的中文的，因為覺得中文小於12px辨識難度太大了，在行動端就我的開發經驗來看

1. 當設定小於12px的字體時，ios沒問題，但是安卓會有問題，即便是用了-webkit-text-size-adjust也不行，因為有的安卓瀏覽器不支援這個特性

2. 如果真的需要有小於12px的字的話，建議用scale來做，這樣可以保證各個端的一致性

Answer 3

1、當樣式表裡font-size<12px時，中文版chrome瀏覽器裡字型顯示仍為12px，這時可用

html{-webkit-text-size-adjust:none;}

2、-webkit-text-size-adjust放在body上會導致頁面縮放失效
3、body會繼承定義在html的樣式
4、用-webkit-text-size-adjust不要定義成可繼承的或全域的

然而只對chrome27.0 版本以下有效，27.0以上版本無效；只對英文才有效，對中文無效。
在新版的chrome中，已經禁止了改屬性,建議使用CSS3中的方法:

transform:scale(0.875);

使用transform:scale(0.875); 不只是文字變小了，整個文字所在的容器也同時會變小。