孙子的CSS规则，不论其父元素如何

Question

我的css规则如下，

.wrapper > h3{
        color:red;
    }

html代码，

<div class='wrapper'>
      <h3>Text1</h3>
    </div>

    <div class='wrapper'>
      <div data-ui-view=''>
          <h3>Text2</h3>        
      </div>      
    </div>

这是plunker。 Text1显示为红色，Text2则不显示。我理解这个规则 将采用<h3>下的直接.wrapper元素。在angularjs中，大多数时候元素将被包裹在标签下。所以，我想制定一个规则，每当<h3>标记进入.wrapper类时，它就必须是红色。与<h3>的父元素无关。有办法吗？

Answer 1

简单地制定规则：

.wrapper h3 { color: red; }

这会使<h3>类中的所有.wrapper元素变为红色

如果您确实希望将孙元素定位为问题标题，则可以使用此规则：

.wrapper > * > h3 { color: red; }