我无法从W3C 规范中理解以下内容。
div * p
匹配作为 DIV 元素的孙子或更高后代的 P 元素。注意“*”两边的空白不是通用选择器的一部分；空格是一个组合符，指示 DIV 必须是某个元素的祖先，并且该元素必须是 P 的祖先。
空格是如何指示 DIV 必须是某个元素的祖先的组合符？
请帮忙澄清
问问题
102 次
1 回答
3
要回答您的问题，您首先需要了解浏览器如何解释 CSS 规则。
无论何时编写 CSS 选择器，都可以在选择器中使用一个或多个元素。例如，选择器div有一个元素，两者div p都有div > p两个。
将 CSS 选择器视为过滤的几个阶段。CSS 选择器实际上是由浏览器从右到左读取它们来解释的。当在选择器中指定多个元素时，您首先找到最右边部分的所有元素的集合，然后通过下一个部分过滤该集合，依此类推。
就div规则而言，我们说的是“找到页面上的所有 'div' 元素”。很简单。
在div p规则的情况下，我们首先“找到页面上的所有 'p' 元素”。但是，对于每个“p”元素，我们会询问“只给我那些以 'div' 作为祖先的 'p' 元素”。
使用相同的逻辑，让我们描述div * p：我们首先“找到页面上的所有 'p' 元素”。接下来，我们要求“只给我具有任何类型父元素的'p'元素”。然后，从那个集合中，我们询问“只给我这个集合中具有 'div' 作为祖先的元素”。
选择器div * p与几乎相同div p，但有一个关键区别：要匹配的选择器必须<div>至少是 的祖父母。有关示例，<p>请参见http://jsfiddle.net/cDTGY/ 。
于 2013-10-22T04:09:36.903 回答