删除在IE上选择箭头 [英] Remove Select arrow on IE

问题描述

我有select元素，我想删除箭头，然后我可以添加其他图标..
i可以为Firefox Safari和Chrome，
，但这不工作 IE9 。

I have select element, i want to remove the arrow, then i can add other icon.. i can do that for Firefox Safari and Chrome, but this didn't work on IE9.

.styled-select select 
{
    border: 0 !important;  /*Removes border*/
    -webkit-appearance: none;  /*Removes default chrome and safari style*/
    -moz-appearance: none;  /*Removes default style Firefox*/
    background: url('select_icon.png')  no-repeat;
     background-position: 179px 7px;
     text-indent: 0.01px;
     text-overflow: "";
     color: #FCAF17;
     width:200px;
 }

SEE 小提示 IE9 。
所有我需要的是删除箭头在ie9
请JSFIDDLE答案。

SEE Fiddle on IE9. all what i need is remove the arrow in ie9 Please JSFIDDLE answer.

推荐答案

在IE9中，可以使用纯粹是一个hack 由@Spudley建议。由于您已自定义div的高度和宽度并选择，因此您需要更改 div：之前 css与您的匹配。

In IE9, it is possible with purely a hack as advised by @Spudley. Since you've customized height and width of the div and select, you need to change div:before css to match yours.

如果是IE10，那么使用下面的css3是可能的

In case if it is IE10 then using below css3 it is possible

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

但是如果你对jQuery插件感兴趣，可以试试 Chosen.js ，或者您可以在js中创建自己的。

However if you're interested in jQuery plugin, try Chosen.js or you can create your own in js.

这篇关于删除在IE上选择箭头的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！