요소의 모든 자식에게 스타일을 적용하려면 어떻게 해야 합니까?

요소의 모든 자식에게 스타일을 적용하려면 어떻게 해야 합니까?

나는 에 대한 요소가 있습니다.class='myTestClass'. 이 요소의 모든 아이들에게 CSS 스타일을 적용하려면 어떻게 해야 합니까?저는 오직 아이들에게 스타일을 적용하고 싶습니다.손자들은 아닙니다.

나는 사용할 수 있습니다.

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

모두에게 효과가 있는div아이들이지만, 모든 아이들에게 효과적인 해결책이 있으면 좋겠습니다.저는 제가 사용할 수 있다고 생각했습니다.*,그렇지만

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

작동하지 않습니다.

편집

그.myTestClass > *selector는 firefox 26의 규칙을 적용하지 않으며 firebug에 따라 마진에 대한 다른 규칙은 없습니다.교체하면 효과가 있습니다.*와 함께div.

David Thomas가 언급한 바와 같이, 이러한 하위 요소의 후손들은 해당 하위 요소에 할당된 대부분의 스타일을 물려받게 될 것입니다.

포장해주셔야 돼요..myTestClass요소 내부에 추가하여 스타일을 자손에게 적용합니다..wrapper * 후행 선택기그다음에 추가합니다..myTestClass > * 자식 선택기를 선택하여 손자가 아닌 요소 자식에 스타일을 적용합니다.예를 들어 다음과 같습니다.

JS Fiddle - 데모

.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>

대신에*셀렉터를 사용할 수 있습니다.:not(selector)와 함께>선택하고 어린이가 아닐 것을 설정합니다.

편집: 저는 그게 더 빠를 줄 알았는데, 제가 틀렸네요.무시.

예:

.container > :not(marquee){
        color:red;
    }


<div class="container">
    <p></p>
    <span></span>
<div>

언급URL : https://stackoverflow.com/questions/26349987/how-do-i-apply-a-style-to-all-children-of-an-element