【问题标题】:Using select for different Drop Down Lists对不同的下拉列表使用 select
【发布时间】:2015-11-04 21:38:39
【问题描述】:

关于如何在 css 中使用选择的任何想法,但只会更改所需的 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;

}

【问题讨论】:

  • 您的规则适用于.theCombo 和所有select 列表。从规则中删除,select,或将其更改为select.theCombo
  • @LuanaFarrugia - 请记住通过单击旁边的复选标记来接受正确回答您问题的答案。您可以根据需要对任意数量的答案进行投票,但您只能接受一个。这有助于未来与您有类似问题的用户快速获得最佳答案。欢迎来到论坛 - 祝你好运!
  • @LuanaFarrugia 不用担心 - 接受自己问题的答案可以获得积分,所以它也对你有帮助。但是,更重要的是,它将帮助未来的用户。谢谢!

标签: html css


【解决方案1】:

你想要的:

select.theCombo

为您的 CSS 选择器。这会通过“theCombo”类抓取所有选择元素和过滤器。

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

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-02-24
    • 2019-07-29
    • 1970-01-01
    • 1970-01-01
    • 2016-01-02
    相关资源
    最近更新 更多