如何使用CSS选择器匹配存在的两个类?

时间:2013-08-18 04:04:13

标签: html css css-selectors

我有以下HTML:

<div class="form">
<input disabled="disabled" data-ng-model="dataId" type="text" />
<div class="disabled input-type-text">123</div>
</div>

我正在尝试匹配禁用类和输入类型文本。我尝试了以下但是它不起作用:

.form .input-type-text.disabled ,
.form input.disabled,
.form input:disabled,
.form select.disabled,
.form select:disabled,
.form textarea.disabled {
  color: #000000;
  background-color: #e6e6e6;
  border: 1px solid #adcede;
  opacity: 0.5;
}

有人可以就如何与CSS选择器匹配给我一些建议吗?请注意,这适用于<input>,但不适用于<div>

2 个答案:

答案 0 :(得分:3)

选择器是正确的:

.form .input-type-text.disabled {
    border: 1px solid #adcede;
    padding: 7px;
    margin: 7px 0 2px 0;
    line-height: 16px
}

问题是您未在"属性中关闭style

<div class="..." style="...ding: 7px; margin: 7px 0 2px 0; line-height: 16px></div>
<!--                                                        Here  ----------^ -->

答案 1 :(得分:-1)

您正在寻找:

  

.form .input-type-text.disabled