Question

我有一些像这样的元素

<div class="t-widget t-window">

Your code goes here

</div>

对于该元素以及我想要应用此规则的所有元素

-webkit-box-sizing : content-box;
       -moz-box-sizing : content-box;
            box-sizing : content-box;

这样做有多容易？

Answer 1

您可以使用以下CSS设置来执行此操作：

<强> CSS：

.t-widget, .t-widget ~ * { /* The ~ * selects all elements following it */
    color: red; /* Added just for illustration */
    -webkit-box-sizing : content-box;
    -moz-box-sizing : content-box;
    -o-box-sizing : content-box;
    box-sizing : content-box;
}

<强> HTML：

<div>Your code goes here</div> <!-- Style will not be applied to this -->
<div class="t-widget t-window">Your code goes here</div> <!-- Style will be applied from this point on -->
<div>Your code goes here</div>
<div>Your code goes here</div>
<div>Your code goes here</div>

Demo

修改：刚刚看到您想要的子元素评论。为此使用下面的CSS。

.t-widget, .t-widget * {
    color: red;
    -webkit-box-sizing : content-box;
    -moz-box-sizing : content-box;
    -o-box-sizing : content-box;
    box-sizing : content-box;
}

Updated Demo

您可以在这里查看comprehensive list of CSS3 Selectors。

将CSS规则应用于内部的所有元素？

1 个答案: