這個問題在這里已經有了答案: '>' 和 CSS 選擇器中的空格有什么區別? (5 個回答) 3 小時前關閉。
我想知道 CSS 選擇器。特別是關于這個:"div p"vs"div > p"
uj5u.com熱心網友回復:
div p<p>:里面的所有元素<div>(包括深度嵌套的元素)
div > p: 所有<p>的直接子元素<div>
uj5u.com熱心網友回復:
“div p”表示div內的所有p,直接或間接子級無關緊要。而“div > p”表示該 div 的直接 p 子級。
uj5u.com熱心網友回復:
也許這個例子會告訴你不同之處。
div p {
color: green;
}
div > p {
text-decoration: underline;
}
<div>
<p>1</p>
<p>2</p>
<p>3</p>
</div>
<div>
<nav>
<p>a1</p>
<p>a2</p>
<p>a3</p>
</nav>
</div>
uj5u.com熱心網友回復:
此示例將讓您了解兩者之間的區別。
div span {
background-color: red;
}
span {
background-color: aqua;
}
p > span {
background-color: red;
}
<div>
<span>Span #1, in the div.
<span>Span #2, in the span that's in the div.</span>
</span>
</div>
<span>Span #3, not in the div at all.</span>
<p>
<span>Span #4, in the div.
<span>Span #5, in the span that's in the div.</span>
</span>
</p>
<span>Span #6, not in the div at all.</span>
轉載請註明出處,本文鏈接:https://www.uj5u.com/houduan/474263.html
