孙子的CSS规则，与其父元素无关

我有如下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>

文本1
文本2

这是你的电话号码。

Text1

以红色显示，但

Text2

不显示。我明白这条规则 将采用

.wrapper

下的立即

元素。在angularjs中，大多数情况下，元素将被包装在标记下。所以，我想制定一个规则，每当

标记进入

.wrapper

类时，它必须是红色的。不考虑

的父元素。有办法吗？

只需制定规则：

.wrapper h3 { color: red; }

这将使

.wrapper

类中的所有

元素变为红色

如果您确实希望按照问题标题的建议，以孙辈元素为目标，则可以使用以下规则：

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

---

这在设置表格元素样式时非常方便，因为在

Table

下是

tbody

、

thead

或

tfoot

，然后是

tr

，然后是我要定位的

th

和

tr

元素，因此，我可以使用

.wrapper>*>*>*

仅对单元格进行样式设置。当然我可以使用

.wrapper th、.wrapper td

，但是如果我使用不同的类添加一个内部表，我必须设置/覆盖父表中的每个对应样式。通过这种方法，我可以为父表使用一个只影响该表元素的复杂类，为内部表使用一个简单得多的类。