Question

我使用SO How to remove the arrow from a select element in Firefox上的方法从select元素中删除了下拉箭头，但我仍然需要IE的解决方案。有什么建议吗？
jsfiddle
HTML：

<div class="select-wrap">
  <select class="input-country" name="country">
    <option value="">-Select Country-*</option>
    <option value="US" selected="selected">USA</option>
    <option value="AF">AFGHANISTAN</option>
    <option value="AL">ALBANIA</option>
  </select>
<div>

CSS：

.select-wrap {
width: 340px;
height: 40px;

border: 1px solid black;
}
select {
width: 340px;
height: 100%;
margin: auto 0;
padding-bottom: 4px;
border: none;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
text-indent: 0.01px;
text-overflow: ''; 
}

我很感激只有CSS的解决方案。

Answer 1

试试这个：

select::-ms-expand {
display: none;
}

请注意，这适用于IE10 +

删除IE中的选择箭头

1 个答案: