这个问题在这里已有答案:
我的问题是关于css选择器之间的星号。似乎星号可以通过两个元素之间的星号数来忽略选择器。
例1:
ul * li {
color:red;
}
<ul>
<li>Item 1</li>
<li>
<ol>
<li>Sub-item 2</li>
<li>Sub-item 2</li>
<li>
<ul>
<li>Sub-item 3</li>
<li>
<ol>
<li>Sub-item 4</li>
<li>Sub-item 4</li>
</ol>
</li>
</ul>
</li>
</ol>
</li>
</ul>
例2:
ul * * * li {
color:red;
}
<ul>
<li>Item 1</li>
<li>
<ol>
<li>Sub-item 2</li>
<li>Sub-item 2</li>
<li>
<ul>
<li>Sub-item 3</li>
<li>
<ol>
<li>Sub-item 4</li>
<li>Sub-item 4</li>
</ol>
</li>
</ul>
</li>
</ol>
</li>
</ul>
例3:
ul * * * * * * * li {
color:red;
}
<ul>
<li>Item 1</li>
<li>
<ol>
<li>Sub-item 2</li>
<li>Sub-item 2</li>
<li>
<ul>
<li>Sub-item 3</li>
<li>
<ol>
<li>Sub-item 4</li>
<li>Sub-item 4</li>
</ol>
</li>
</ul>
</li>
</ol>
</li>
</ul>
请考虑我的问题是关于两个元素之间的星号,当用作selector *
时它的行为是不同的。任何人都可以解释这是怎么发生的?提前致谢。
*
是universal selector。它匹配任何元素。
它与descendant combinator一起使用。
所以ul * li
的意思是“一个li
,它是任何元素的后代,是ul
的后代”。或者,换句话说,“li
是ul
的后代,但不是ul
的孩子,选择器的ul
部分匹配”。