html5 - 在移動(dòng)端設(shè)置font-size小于12px。line-height的問(wèn)題
問(wèn)題描述
正如標(biāo)題所說(shuō),比如我在一個(gè)標(biāo)簽內(nèi)設(shè)置font-size:10px,那么他的line-height就默認(rèn)為16px了,在設(shè)置line-height:10px是不生效的,設(shè)置line-height大于12px的時(shí)候就生效了,ios上沒(méi)問(wèn)題,這是什么情況啊。。。有解決辦法沒(méi)
問(wèn)題解答
回答1:當(dāng)樣式表里font-size<12px時(shí),chrome瀏覽器里字體顯示仍為12px,這時(shí)可以用 html{-webkit-text-size-adjust:none;}
回答2:chrome之前是不支持12px以下的中文的,因?yàn)橛X(jué)得中文小于12px識(shí)別難度太大了,在移動(dòng)端就我的開(kāi)發(fā)經(jīng)驗(yàn)來(lái)看
當(dāng)設(shè)置小于12px的字體時(shí),ios沒(méi)問(wèn)題,但是安卓會(huì)有問(wèn)題,即便是用了-webkit-text-size-adjust也不行,因?yàn)橛械陌沧繛g覽器不支持這個(gè)特性
如果真的需要有小于12px的字的話(huà),建議用scale來(lái)做,這樣可以保證各個(gè)端的一致性
回答3:1、當(dāng)樣式表里font-size<12px時(shí),中文版chrome瀏覽器里字體顯示仍為12px,這時(shí)可以用
html{-webkit-text-size-adjust:none;}
2、-webkit-text-size-adjust放在body上會(huì)導(dǎo)致頁(yè)面縮放失效3、body會(huì)繼承定義在html的樣式4、用-webkit-text-size-adjust不要定義成可繼承的或全局的
然而只對(duì)chrome27.0 版本以下有效,27.0以上版本無(wú)效;只對(duì)英文才有效,對(duì)中文無(wú)效。在新版的chrome中,已經(jīng)禁止了改屬性,建議使用CSS3中的方法:
transform:scale(0.875);
當(dāng)使用transform:scale(0.875)時(shí); 不僅是文字變小了,整個(gè)文字所在的容器也同時(shí)會(huì)變小。
相關(guān)文章:
1. docker網(wǎng)絡(luò)端口映射,沒(méi)有方便點(diǎn)的操作方法么?2. docker images顯示的鏡像過(guò)多,狗眼被亮瞎了,怎么辦?3. Java:密碼包(加密和解密)。無(wú)效的密鑰錯(cuò)誤4. css - 微信小程序點(diǎn)擊展開(kāi),再次點(diǎn)擊收回5. 點(diǎn)擊頁(yè)面就自動(dòng)輸入到mysql.求解6. macos - mac下docker如何設(shè)置代理7. css - vue.js的vue單文件組件style中的scoped屬性無(wú)效8. angular.js - 在ng-option 里使用過(guò)濾器無(wú)效9. node.js - 求問(wèn)nw.js開(kāi)發(fā)桌面版,其js計(jì)算性能如何?10. 我在centos容器里安裝docker,也就是在容器里安裝容器,報(bào)錯(cuò)了?
