Question

我无法更改select height，所有浏览器都能正常工作，但Safari不行，哪里可能有问题？我也试着上课.style select，但没有工作。

select {
width: 170px; 
height: 25px;
}

Answer 1

您也可以使用

line-height: 25px

不影响其他浏览器，但修复了Safari中的这个错误

Answer 2

要在Safari中设置选择样式，首先必须关闭操作系统样式：

-webkit-appearance: none;

Answer 3

尝试添加此内容：

-webkit-appearance: menulist-button;

Answer 4

最好的方法是使用现代化探测器并给出safari类选择菜单

db.doc.find ( {"$and" : [ {"logs" : { "$elemMatch" : { "n" : "ip", "v" : "137.68.160.51" } } }, {"logs" : { "$elemMatch" : {  "n" : "port", "v" : "53" } } } ]})

或者您可以使用jquery UI选择菜单通过另一个跨浏览器来解决这个问题。

Answer 5

@media screen and (-webkit-min-device-pixel-ratio:0) {
    select {
        -webkit-appearance: menulist-button !important;
        line-height:24px !important;
    }
}

此代码确保跨浏览器的高度相同。

Answer 6

至少在iPad上，选择不会呈现为填充或行高，而是呈现给定的高度和垂直居中的值

select {
   -webkit-appearance:menu-item; // or menulist-button
   -moz-appearance:menu-item;
   height:2.4em;   // this must be calculated to match other input types     
}

input[type="text"], select {
    min-width:12em;  
    border-radius:5px;
}

现在唯一尚未解决的问题是预定义且不可变的背景

Answer 7

在使用内联样式之前，没有什么对我有用：

<select name="pickupsel" id="pickups" style="line-height:33px">

不知何故，Safari（最新的Windows版本，5.1.7）不会从CSS文件中读取此样式属性。

Answer 8

@media screen and (-webkit-min-device-pixel-ratio:0) { select { -webkit-appearance: menulist-button !important; line-height:24px !important; } }

根据您的要求提供line-height。

Safari更改选择高度

8 个答案: