[英]IE9 Double drop down issue
自定義圖像已添加到選擇框,除IE9外,它的每個瀏覽器都顯示良好。 我可以看到兩個箭頭,一個是自定義箭頭圖像,另一個是下拉圖標。 我如何刪除IE9上的那個下拉圖標。 如果有人知道,請幫助我。
.dropdown {
height: 90px;
overflow: hidden;
background: url(../images\valdropdown.png) no-repeat right;
background-size: 10% 100%;
position:relative;
display:inline-block;
}
.dropdown select {
background: transparent;
-o-appearance:none;
-prefix-appearance: none;
-ms-box-sizing:content-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
overflow: hidden;
appearance:none
padding:5px;
font-size: 16px;
line-height: 1;
border: none;
border-radius: 0;
height: 50px;
z-index: -1;
-webkit-appearance: none;
-moz-appearance: none;
text-indent: 0.01px;
text-overflow: '';
}
可以這樣做。 在這里擺弄
例如,在select
設置了固定寬度,並用較低的寬度和div覆蓋了div並overflow:hidden
了它,以掩蓋/隱藏下拉菜單。 它具有全面的支持,並且實際上在所有瀏覽器中都隱藏了箭頭。
的HTML
<div>
<select>
<option>one</option>
<option>two</option>
<option>three</option>
</select>
</div>
的CSS
div {
width: 80px;
overflow: hidden;
border: 1px solid black;
}
select {
width: 100px;
border: 0px;
}
或使用純CSS
select::-ms-expand {
display: none;
}
或與jQuery
selectbox替換。
這是一個jQuery插件。
jQuery selectbox插件
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.