如何删除选择框的背景

Question

我必须删除selectbox的背景，我使用过这样的代码

<select style="background:none;border:none">
<option>A</option>
<option>B</option>
<option>C</option>
<option>D</option>
</select>

但是在输出箭头出现了。我怎么能隐藏那个箭头。

Answer 1

添加-webkit-appearance:none

<select style="background:none;border:none; -webkit-appearance:none">

或添加div并给出最大宽度。

<div style="width:80px; overflow:hidden">
<select style="background:none;border:none; width:97px">
<option>A</option>
<option>B</option>
<option>C</option>
<option>D</option>
</select>
</div>

<强> Updated DEMO

Answer 2

选择宽度超过100％并应用overflow：hidden

select {
    overflow:hidden;
    width: 120%;
}

看到这个链接，第二个答案似乎更像是你所追求的！

How to remove the arrow from a select element in Firefox