使用select选择不同的下拉列表

时间:2015-11-04 12:28:46

标签: html css

有关如何在css中使用select的任何想法,但只会更改所需的DDL而不是所有DDL。

示例: HTML:

   <div style="position: relative; float: left;  margin-left: 12px;">
             <select class="theCombo">
                 <option value="" class="theCombo">&nbsp; Choose...</option>
                <option value="1">&nbsp; Visa</option>
                <option value="2">&nbsp; Neteller</option>
             </select>
          </div>

CSS:

.theCombo,select { /* Incorrect : changing all selects of the ddl*/
  -webkit-appearance: none;
  -moz-appearance: none; 
  text-overflow: ellipsis;
  color: white;
  cursor: pointer;  
  outline: none;
  border: 1px solid #E4EBED;
    border-radius: 3px;
  width: 157px;
 /* height: 32px;
  line-height: 25px;*/
  font-size: 16px;
  vertical-align: middle;
  background-color: #333333 !important; 
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAKCAMAAACdQr5nAAAAPFBMVEXn6+P3+/L3+/L0+O/3+/L3+/L3+/L3+/L3+/L3+/L3+/L3+/L0+O/n6+Pq7eX3+/IAAAD2+vHz9+73+/KWthK3AAAAEXRSTlP0MXqqRZEIkAlEMnmr8+IRAJig9poAAABYSURBVHjadY5JDoAwDAMLdF+T+v9/hYIqFFDnFHtysKIlio72ppaFQgkzhAKpwM6O0zqGVHsHaiTaKtCTUBTvLj0fUpE3jAs2nqQa6AIo/R0/V+dGP7XkBDn1D5sPSFgFAAAAAElFTkSuQmCC");
  background-repeat: no-repeat;
  background-position: right center;

}

1 个答案:

答案 0 :(得分:1)

你想要:

select.theCombo

用于CSS选择器。这将通过“theCombo”类获取所有选择元素和过滤器。

In CSS is there a selector for referencing a specific input type that also has a class?