Safari瀏覽器對設定的高度不起作用,解決方案
阿新 • • 發佈:2018-03-15
發現 文字 one 底部對齊 設定 pan select標簽 pro prop
1、在做瀏覽器兼容的時候,發現select標簽在safari蘋果瀏覽器中的高度永遠都是默認的,這時候解決的辦法是加上line-height屬性就可以設置;
2、但加上line-height屬性可以設置高度後你會發現高度變大了,safari瀏覽器對select默認上下邊距padding各多出3px的高度; 比如設置height:24px;safari下面會變成30px;這樣一來,就和別的瀏覽器無法統一了,試過-webkit-appearance:none;但是清掉下拉圖標,文字都成了底部對齊,也不行,曾一度想用div+ul來代替select,又發現這樣真的很麻煩;
3、解決辦法:經過探索發現,safari蘋果瀏覽器有一種特有的寫法從未見過:
input{height:30px;line-height:30px;[;height:24px;line-height:24px;]}
如果Safari瀏覽器的input高度設置不管用,一定要設置line-height,然後去除iOS固有UI樣式:-webkit-appearance: none;
Safari瀏覽器對設定的高度不起作用,解決方案