考虑以下HTML标记:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

    <head>
        <title>search/master</title>
        <style type="text/css">
            select{
                background-color: pink;
            }
            option{
                background-color: white;
            }
        </style>
    </head>

    <body>
        <p>
            <select>
                <option>one........</option>
                <option>two........</option>
            </select>
        </p>
    </body>
</html>


在FF上的输出如下:(类似的输出也出现在Chrome,Safari和Opera上)



但是在IE上的输出如下:



使IE上的输出看起来与其他浏览器相似的可靠而简单的解决方法是什么?

最佳答案

如果您确实想这样做,则可以使用1px x 1px的背景图片,并将选项设置为:transparent

select{
    background: url(http://ajthomas.co.uk/stackoverflow-help/back.png);
}
option{
    background: transparent;
}


查看我为您完成的jsfiddle example

09-20 23:42