IE9中的选择框自定义答案

【问题标题】：select box customization in IE9IE9中的选择框自定义
【发布时间】：2018-06-08 00:17:29
【问题描述】：

我使用下面的css属性自定义了选择框箭头。它适用于除IE9之外的其他浏览器。自定义后在IE9中可以找到两个重叠的箭头，分别是默认箭头和应用自定义箭头。有没有其他方法可以自定义选择所有浏览器的框？

select {
  appearance: none;
  -ms-appearance: none;
  -o-appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background: url('../img/icons/list-benifit-drop.png') no-repeat;
  background-position: 100%;
  text-indent: 0.01px;
  text-overflow: "";
  overflow: hidden;
  box-shadow: none;
}

<select>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>

干杯！！！

【问题讨论】：

添加您的html
嗨，我已经添加了 HTML 代码。

标签： html css internet-explorer internet-explorer-9

【解决方案1】：

您应该尝试为不同的浏览器使用不同的样式表文件并覆盖选择框的样式。

<!--/!--[if lte IE 9]-->
    <link rel="stylesheet" href="css_for_IE9.css">
<!--[endif]--//-->

另外，您可以使用 Bootstrap 并自定义他们的选择框。

【讨论】：