移动浏览器的样式下拉列表

Question

我想为移动浏览器设置下拉列表的样式。

看起来像这样：

我希望这样做：

我已经应用了一些CSS，例如：

background-image:url("../images/mobilecategory.png");
background-position:center center;
background-repeat:no-repeat;
background-size:100%;
width:200px;
height:40px;

但它不起作用。

如果有人对此有所了解，请分享。

感谢!!!

Answer 1

你可以像这样设置下拉样式：

border-radius:0px !important;
-webkit-border-radius:0px !important;
border-top-left-radius:0px !important;

border: 1px #abc1cf solid !important;

-webkit-appearance: none;  /*Removes default chrome and safari style*/
-moz-appearance: none;  /*Removes default style Firefox*/
background: url('../images/arrow.png')  no-repeat;
background-position: right center;
text-indent: 0.01px; 
text-overflow: ""; 
color: #6b6b6b;  
font-weight:bold;

试试这个。