如何将样式应用于元素的所有子元素

我有一个元素class='myTestClass'。如何将 css 样式应用于此元素的所有子元素？我只想将样式应用于元素子元素。不是它的孙子。

我可以用

.myTestClass > div {
  margin: 0 20px;
}

对所有人都有效div孩子们，但我想要一个适用于所有孩子的解决方案。我以为我可以用*, but

.myTestClass > * {
  margin: 0 20px;
} 

不起作用。

Edit

The .myTestClass > *选择器在 firefox 26 中不应用该规则，并且根据 firebug，没有其他关于边距的规则。如果我更换它就会起作用* with div.

正如评论者大卫·托马斯 https://stackoverflow.com/questions/26349987/how-do-i-apply-a-style-to-all-children-of-an-elements#comment41360515_26349987，这些子元素的后代将（可能）继承分配给这些子元素的大部分样式。

你需要包裹你的.myTestClass在元素内部并通过添加将样式应用于后代.wrapper * 后代选择器 https://developer.mozilla.org/en-US/docs/Web/CSS/Descendant_selectors。然后加.myTestClass > * 子选择器 https://developer.mozilla.org/en-US/docs/Web/CSS/Child_selectors将样式应用于子元素，而不是其孙子元素。例如这样：

JSFiddle -DEMO http://jsfiddle.net/a8wmyg39/

.wrapper * {
    color: blue;
    margin: 0 100px; /* Only for demo */
}
.myTestClass > * {
    color:red;
    margin: 0 20px;
}

<div class="wrapper">
    <div class="myTestClass">Text 0
        <div>Text 1</div>
        <span>Text 1</span>
        <div>Text 1
            <p>Text 2</p>
            <div>Text 2</div>
        </div>
        <p>Text 1</p>
    </div>
    <div>Text 0</div>
</div>