如何添加 <div>
或 <span>
<option>
内的标签标签?
我希望该行是 <option>
当然它有一个值和一切,但我需要在那个选项的文本旁边放一个红色的圆圈,这可能吗?
代码如下:
<option value="1">text<div style='background:none repeat scroll 0 0 green;height:25px;width:25px;'></div></option>
<option value="2">text<div style='background:none repeat scroll 0 0 green;height:25px;width:25px;'></div></option>
<option value="3">text<div style='background:none repeat scroll 0 0 green;height:25px;width:25px;'></div></option>
<option value="4">text<div style='background:none repeat scroll 0 0 green;height:25px;width:25px;'></div></option>
2019 年更新
此解决方案不再有效。
检查了最新的 Chrome、Firefox 和 Safari。
可以在文本后放一个红色圆圈 - http://jsfiddle.net/V8cvQ/
option:after {
content: " ";
height: 5px;
width: 5px;
background: #c00;
border-radius: 5px;
display: inline-block;
}
...
更新
要有不同颜色的点
HTML
<select>
<option> select </option>
<option class="red"> one </option>
<option class="green"> two </option>
<option class="blue"> three </option>
</select>
CSS
option:after {
content: " ";
height: 5px;
width: 5px;
border-radius: 5px;
display: inline-block;
}
option.red:after { background: #c00; }
option.green:after { background: #0c0; }
option.blue:after { background: #00c; }
DEMO