相关疑难解决方法(0)

我想从HTML <select>元素中删除下拉箭头.例如:

<select style="width:30px;-webkit-appearance: none;">
    <option>2000</option>
    <option>2001</option>
    <option>2002</option>
    ...
</select>

如何在Opera,Firefox和Internet Explorer中完成？

我使用下面的CSS来隐藏FF,safari,chrome中的下拉箭头,并添加了我自己的图像来自定义.

select 
{
  -webkit-appearance:none;
  -moz-appearance:none;
  -o-appearance:none;
   appearance:none; 
}

对于IE10,我使用了伪元素

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

我不知道如何为IE9和IE8应用相同的内容.任何人都可以告诉我如何隐藏IE8和IE9中的下拉箭头.

DEMO

我试过css appearance: none;来隐藏选择下拉箭头.但在IE9箭头显示.供参考,请参阅图像.

知道如何使用css或jquery隐藏箭头吗？

这是我的代码:

    .fields-set select{
height:32px;
border:1px solid #ccc;
margin: 0 19px 0 1%;
padding:0 32px 0 1%;
width:55%;
float: left;
overflow: hidden;
background:url("https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcR3xT6PSVebCcTYjggESCb55GBM91fGgbyrMFbs3CGeFoQjFwVB") no-repeat scroll right center padding-box border-box #FFF;
box-shadow: none;
-webkit-appearance: none;
   -moz-appearance: none;
        appearance: none;
    -ms-appearance: none  \9;
     -o-appearance: none;
    }