css选择器之间的星号(*)的含义[重复]

问题描述 投票:0回答:1

这个问题在这里已有答案:

我的问题是关于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 *时它的行为是不同的。任何人都可以解释这是怎么发生的?提前致谢。

html css css-selectors
1个回答
1
投票

*universal selector。它匹配任何元素。

它与descendant combinator一起使用。

所以ul * li的意思是“一个li,它是任何元素的后代,是ul的后代”。或者,换句话说,“liul的后代,但不是ul的孩子,选择器的ul部分匹配”。

© www.soinside.com 2019 - 2024. All rights reserved.