what different is .selector1 .selector2
and .selector1开发者_运维知识库 > .selector2
? Dont then both indicate the .selector2 is child of .selector1
What is different?
>
means the second element must be an immediate child. Using simply the space, the second element can be found anywhere "underneath" the first element. For example:
<ul id="root">
<li id="a">
<ul>
<li id="x"></li>
<li id="y"></li>
</ul>
<li id="b">
Something
</li>
</ul>
The selector '#root > li'
only matches a
and b
, but '#root li'
matches x
and y
as well.
The first form matches any descendent no matter how many levels down it is, while the second form matches only immediate children.
Take this hierarchy of elements:
<div id="Bob" class="selector1">
<div id="Mary" class="selector2">
<div id="Alice" class="selector2">
</div>
</div>
</div>
The selector .selector1 .selector2
will match both Mary and Alice. On the other hand, .selector1 > .selector2
will only match Mary, because Alice is not an immediate child of a selector1
element.
精彩评论