html - 如何在谷歌浏览器的选择框中显示图像

Question

我想在谷歌浏览器的选择下拉框中显示图像。仅在谷歌浏览器中不显示图像，但所有浏览器都显示图像。

谷歌浏览器图像看起来像......

所有浏览器显示图像看起来像......

所以我想在所有浏览器中制作相同的选择框。

我的代码是..

.selectbox_bg {
    background: url("images/contact_texbox_bg.png") no-repeat scroll 0 0 transparent !important;
    border: medium none;
    color: #5D5C5C !important;
    font-size: 15px;
    height: 33px;
    line-height: 33px;
    padding: 6px 10px;
    width: 255px;
}

请帮我。

谢谢你。

Answer 1

试试这个，把你的背景图片放进去background:url，粘贴剩下的代码，并相应地调整所有参数。

background:url(selectbox.png) no-repeat !important;
-webkit-appearance: none;
-moz-appearance: none;
border: medium none;
color: #5D5C5C !important;
font-size: 15px;
height: 33px;
line-height: 33px;
padding: 6px 10px;
width: 255px;

Answer 2

你可以用css来做

select{
    background-color: #9BD300;   
   border-radius:4px; 
    border:1px #99CC00 solid; 
    padding:4px;
    width:150px
}​

演示

或者试试这个

.selectbox_bg {
    background: url("images/contact_texbox_bg.png");
    background-position: 0 0;        
    background-repeat: no-repeat;
    background-attachment:scroll;
    background-color:transparent;
    border: medium none;
    color: #5D5C5C !important;
    font-size: 15px;
    height: 33px;
    line-height: 33px;
    padding: 6px 10px;
    width: 255px;
}