我希望图像图标在选择/选项元素上显示为背景图像。它可以在Firefox上完美运行,但是在Chrome中图像根本不显示吗?

下面是我使用的示例代码。

<select style="-webkit-appearance: none;">
  <option value="1" style="background:url('http://downloadicons.net/sites/default/files/anticlockwise-small-arrow-icons-57546.png') no-repeat right center">OPTION ONE</option>
  <option value="2" style="background:url('http://www.w3f.com/gifs/bullits/star3.gif') no-repeat right center">OPTION TWO</option>
</select>


我在这里创建此JS:https://jsfiddle.net/03vaaL5o/

我应该怎么做才能在Chrome以及所有其他现代浏览器(Opera,Edge)中正确显示图标?

最佳答案

根据您链接的其他文章,这在整个浏览器中都不是一致的。正式不支持样式选择框的样式。您应该使用这样的东西:

https://jqueryui.com/selectmenu/#custom_render

关于html - HTML选择/选项下拉菜单-背景图像未出现在Chrome/Edge中,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/34125847/

10-14 14:37
查看更多