The select control is not easy to manage with CSS!
This can be achieved by writing width:??px; in style.
height:??px; This cannot be achieved. The height can only be changed by adjusting the size of the font inside.
Background can be achieved, but using a background image is not possible.
The border of select is blue by default, and it cannot be changed using the border attribute of CSS. The border can only be changed through camouflage. Here is a detailed introduction:
Idea: First create a layer with the expected border, and put the select inside. The size of the select is slightly larger than the div, so that the content beyond the layer is hidden and the border of the select is covered.
<div style="border:solid 1px #ffcc00; width:100px; height:20px;overflow:hidden;">
<select name="select" style="width:105px; height:25px; margin-left:-1px; margin-top:-1px;" name="select" >
<option value="1">Ordinary member</option>
<option value="2">Level 2 or local club</option>
<option value="3">Association</option>
</select>
</div>
Using this method, you can make the select without a border or change the border. But this is only limited to the list state of the select. When it is displayed in the multiple state, there will be a trace of the frame depth limit in IE, and in FF Not there! You little guy is so hard to control!