Question

<div class="rightsidebox">
    <div class="item-info-list">
        <p>Model: AIDCU</p>
        <div class="product-details">
            <p></p>
            <div class="price-box"> <span class="regular-price" id="product-price-1617-related">
      <span class="price">$8.99</span></span>
            </div>
            <p></p>
        </div>
    </div>

我想制作一个价格的样式，并将颜色设为绿色只是在右边框div中我想使用css，我不能改变结构，因为它是一个主题，它不应该与其他主题的其他价格

我可以使用div.rightsidebox>div.item-info-list

但由于那里的段落，我不能再进一步了我怎么解决呢？我在使用“＆gt;”方面有弱点和彼此的多个班级

Answer 1

我相信这就是你要找的东西：

div.rightsidebox>div.item-info-list>div.product-details {
    background:#ff0000;
}

JSFiddle：http://jsfiddle.net/RF5e7/

Answer 2

如果您只是想选择price并将其设为绿色（如果它包含在右栏中）：

.rightsidebox .price {
     color: green !important;
}

Answer 3

div.rightsidebox>div.item-info-list .price{
    color: green;
}

JSFiddle示例。

Answer 4

.rightsidebox .item-info-list p {
  /* code */
}

这将归结为样式表内部定义的类内的段落元素（偏离过程）。

如果您拥有多个元素的类名，则不需要使用仅所需的div.rightsidebox。否则只有.rightsidebox可以。

您可以在此处了解有关CSS子选择器的更多信息：https://developer.mozilla.org/en-US/docs/Web/CSS/Child_selectors

Answer 5

.rightsidebox .price { color: green !important; } // important to override other styles

编辑：＆gt;的使用 - 选择器

元素＆gt;元素选择器用于选择具有特定父元素的元素。注意：未选择直接不是指定父级子级的元素。 More info

如何选择一个多元素的子类

5 个答案: