无论如何，我都不是一个网络开发人员，我基本上通过试验和大量错误来按照我想要的方式完成事情。我似乎无法弄清楚这一点。我想将下拉选择器的样式从使用默认操作系统样式更改为我找到的合适样式，但我不知道该去哪里。这是我现有的下拉选择器 css：
/* select
==========================================================*/
.selector, .selector * {
/* margin: 0;
padding: 0; */
}
.selector select:focus { outline: 0; }
div.selector {
/* background-position: -490px -24px;
display: inline-block;
overflow: hidden;
padding-left: 2px;
position: relative;
vertical-align: middle;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
-webkit-box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.2);
box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.2); */
}
div.selector span {
/* background-position: 100% 0;
color: #fff;
font-size: 11px;
font-weight: bold;
overflow: hidden;
padding: 0px 27px 0px 7px;
text-overflow: ellipsis;
text-shadow: 1px 1px 0 #000;
white-space: nowrap; */
}
div.selector select {
/*background: #fff;
color: #000;
border: none;
left: 0;
opacity: 0;
position: absolute;
top: 0;
width: 100%;
text-transform:none;*/
font-size:12px;
opacity: 1 !important;
}
div.selector, div.selector span {
/*background-repeat: no-repeat;
line-height: 24px;
text-transform: uppercase;
background-image: url("sprite.png");
background-repeat: no-repeat;
line-height: 24px;*/
}
div.selector, div.selector span, div.selector select { /*height: 24px;*/ }
/* #sort {
margin: 10px 0;
float:right;
width:257px;
}
#sort span {display:none;}
#sort SELECT {
background: none repeat scroll 0 0 #fff;
color: #000;
vertical-align: bottom;
opacity:1 !important;
float:left;
} */
button, textarea, input[type=text], input[type=password] {
border: 0;
margin: 0;
padding: 0;
}
textarea, input[type=text], input[type=password], select, .selector span {
color: #888;
font: 12px 'Helvetica Neue', Arial, sans-serif;
}
input[type=submit] { font: 12px 'Helvetica Neue', Arial, sans-serif; }
textarea, input[type=text], input[type=password] {
border: 1px solid #a9a9a9;
padding: 4px 8px;
}
button {
background: transparent;
color: #1b1e00;
font-size: 28px;
text-transform: lowercase;
}
button, label, input[type=submit] { cursor: pointer; }
.selector span { display: block; }
.selector, .selector span, .selector select { cursor: pointer; }
这是我希望它看起来像的css：
/* all form DIVs have position property set to relative so we can easily position newly created SPAN */
form div{position:relative;}
/* setting the width and height of the SELECT element to match the replacing graphics */
select.select{
position:relative;
z-index:10;
width:166px !important;
height:26px !important;
line-height:26px;
}
/* dynamically created SPAN, placed below the SELECT */
span.select{
position:absolute;
bottom:0;
float:left;
left:0;
width:166px;
height:26px;
line-height:26px;
text-indent:10px;
background:url(images/bg_select.gif) no-repeat 0 0;
cursor:default;
z-index:1;
}
基本上我不知道去哪里了。任何帮助将不胜感激。
谢谢！