android上line-height的問題


關於line-height大家應該非常熟悉了吧,就是用來做垂直居中的,屢試不爽,基本上沒有什么問題,但是最近一個項目,測試提了一個bug,看圖吧。

從別處竊的圖,這個問題只有安卓上才能復現,做了demo,發現應該是font-size的問題,你們可以自己試試,font-size為13px或者奇數時,line-height會有一定的偏差,在safari上沒有問題,至於原因,現在還沒找到,等找到了再來補充吧。

解決辦法

 雖然原因沒有找到,但是可以大致猜出是安卓上奇數字號導致line-height均分上下邊距的時候出現了偏差,那么,我們就可以通過這方面入手。

既然line-height均分不了,那就拋棄line-height吧,看代碼

element{

  font-size: 13px;

  line-height:0;

  padding: 15px 0;//相當於line-height 30px

}

很簡單吧,將line-height設為0,用padding來進行填充,完美實現,自測沒什么問題,如果造成其他問題,歡迎留言指出


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM