内容字号: 默认 大号 超大号

段落设置:段首缩进取消段首缩进

字体设置:切换到宋体切换到微软雅黑

[已解决]safari苹果浏览器下select高度无法设置的问题,padding多出3px的问题

发布:2017-07-07 浏览: 评论(
  1. 在做浏览器兼容的时候,发现select标签在safari苹果浏览器中的高度永远都是默认的,这时候解决的办法是加上line-height属性就可以设置;

  2. 但加上line-height属性可以设置高度后你会发现高度变大了,safari浏览器对select默认上下边距padding各多出3px的高度; 比如设置height:24px;safari下面会变成30px;这样一来,就和别的浏览器无法统一了,试过-webkit-appearance:none;但是清掉下拉图标,文字都成了底部对齐,也不行,曾一度想用div+ul来代替select,又发现这样真的很麻烦;

  3. 解决办法:经过探索发现,safari苹果浏览器有一种特有的写法从未见过:

假如原来的高度是这样的:

height:30px;line-height:30px;

想要兼容safari苹果浏览器,要加上苹果的特有写法:

[;height:24px;line-height:24px;]

所以最后的写法就是:

height:30px;line-height:30px;[;height:24px;line-height:24px;]

奇葩吧?不过能用就很好了,快试试吧!

前端新手交流群
欢迎加入web前端新手交流qq群:734802480

更多文章

相关文章

评论

发表评论愿您的每句评论,都能给大家的生活添色彩,带来共鸣,带来思索,带来快乐。


Copyright © 2014-2021 seozhijia.net 版权所有-粤ICP备13087626号-4