Question

我有一个CSS问题：

我用3个选项创建了这个选项:(可以在这里找到：jsFiddle）

<select id="currency_dropdown_select" name="currency">
    <option class="currency_dropdown_option" style="background:url('http://www.jorggray.co.uk/skin/frontend/default/luxury/images/flags/img-GBP.jpg');" value="GBP" selected="selected"></option>

    <option class="currency_dropdown_option" style="background: url('http://www.jorggray.co.uk/skin/frontend/default/luxury/images/flags/img-EUR.jpg');" value="EUR"></option>

    <option class="currency_dropdown_option" style="background:url('http://www.jorggray.co.uk/skin/frontend/default/luxury/images/flags/img-USD.jpg');" value="USD"></option>
</select>

我已经尝试了很多改变来解决这个问题但是任何已知的解决方案都没有用。没有adblock块，因为它已被禁用。

尝试使用背景图像，但没有结果。

有什么想法吗？

Answer 1

OPTION标记不完全支持CSS，因为它们是操作系统级别的控件。每个系统和浏览器都以不同的方式呈现它们。

如果您想要下拉列表中的背景，最好使用基于JavaScript的背景，将无序列表转换为下拉列表，例如jQuery UI或Twitter Bootstrap中的列表。

在Chrome / Safari / IE上没有显示内联css背景，但它适用于Mozilla Firefox

1 个答案: