表单选择下拉列表的每个选择元素的背景图像

时间:2011-11-01 10:15:54

标签: html css

我已经为表单的每个元素设置了样式类,但是为表单下拉列表设置相同的背景会给我一个错误..你可以看到菜单在下拉时看到的内容what it looks like http://justni.com/booking.png

 .input_field{
    background-image:url('imgs/fieldbg.png');
    background-repeat:no-repeat;
    border:0px;
    width:465px;
    height:46px;
    padding-left:20px;
    font-family:'Conv_lt_21019',Sans-Serif;
    color:#FFFFFF;
    font-size:22px;

}
select { -webkit-appearance: none; }

.input_field option{
    background-image:url('imgs/fieldbg.png');
    background-repeat:no-repeat;
    border:0px;
    width:465px;
    height:46px;
    padding-left:20px;
    font-family:'Conv_lt_21019',Sans-Serif;
    color:#FFFFFF;
    font-size:22px;

}

这是我的HTML!

<select name="wave" class="input_field">
<option value="0">1</option>
<option value="1" selected="selected">2</option>
<option value="2">3</option>
<option value="3">4</option>
<option value="4">5</option>
<option value="5">6</option>
<option value="6">7</option>
<option value="7">8</option>
<option value="8">9</option>
<option value="9">10</option>
<option value="10">11</option>
<option value="11">12</option>
<option value="12">13</option>
</select>

我想要一个箭头,如果没有 - 为下拉列表的每个元素重复该类

1 个答案:

答案 0 :(得分:1)

不知道这是否是您所期望的。但请尝试this