我知道如何使用 CSS 背景图像属性让图片显示在 HTML 下拉表单元素中的选项旁边。
但是，图像不会显示在所选元素上。有什么方法可以做到这一点（最好只使用CSS）？
EDIT:
这是列表元素的工作代码的示例。但是，当下拉菜单关闭时，您只能看到所选元素的文本，而看不到图像：
<select name="form[location]">
<option value="ad" style="background: url(img/flags/ad.gif) no-repeat; padding-left: 20px;">Andorra</option>
<option value="ae" style="background: url(img/flags/ae.gif) no-repeat; padding-left: 20px;">United Arab Emirates</option>
<option value="af" style="background: url(img/flags/af.gif) no-repeat; padding-left: 20px;">Afghanistan</option>
<option value="ag" style="background: url(img/flags/ag.gif) no-repeat; padding-left: 20px;">Antigua and Barbuda</option>
<option value="ai" style="background: url(img/flags/ai.gif) no-repeat; padding-left: 20px;">Anguilla</option>
<option value="al" style="background: url(img/flags/al.gif) no-repeat; padding-left: 20px;">Albania</option>
<option value="am" style="background: url(img/flags/am.gif) no-repeat; padding-left: 20px;">Armenia</option>
<option value="an" style="background: url(img/flags/an.gif) no-repeat; padding-left: 20px;">Netherlands Antilles</option>
<option value="ao" style="background: url(img/flags/ao.gif) no-repeat; padding-left: 20px;">Angola</option>
<option value="ar" style="background: url(img/flags/ar.gif) no-repeat; padding-left: 20px;" selected="selected">Argentina</option>
[...] - I think you get the idea.
</select>
以跨浏览器的方式做到这一点将非常具有挑战性，而且我怀疑这是不可能的。
相反，您可能想尝试使用看起来和行为都像选择框的小部件，但它是用 HTML 和 Javascript 制作的。
这是使用 jQuery 实现此目的的一种方法：
jquery.combobox http://web.archive.org/web/20130430100104/http://jquery.sanchezsalvador.com/page/jquerycombobox.aspx
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
