CSS选择器由浏览器引擎从右到左匹配.因此,他们首先找到孩子,然后检查他们的父母,看看他们是否符合规则的其余部分.
对我来说,最简单的方法是使用元素数量最少的选择器.首先是ID(因为它们应该只返回1个元素).然后可能是类或具有最少节点数的元素 - 例如,页面上可能只有一个跨度,因此可以使用引用跨度的任何规则直接到达该节点.
以下是备份我的说法的一些链接
这听起来像这样做是为了避免必须看到父母的所有孩子(可能是很多孩子),而不是一个孩子的所有父母必须是一个孩子.即使DOM很深,它也只会在每个级别查看一个节点而不是RTL匹配中的多个节点.评估CSS选择器LTR或RTL更容易/更快?
是div.container速度比.container?你知道在jquery中,如果你对你的选择器更具体,它会更快,因为它迭代通过更少..这是css的情况吗?
有没有办法衡量css的性能?性能方面,这样的事情是否重要甚至完全取决于文本权重?
如果有人知道答案,我会很高兴,我实际上找到了一个类似的问题而没有确定的答案. 如果更好地指定CSS可以更有效吗?
E + F匹配紧跟在兄弟元素E之前的任何F元素.
运营商优先级怎么样?是什么#id1 #id2 + #id3比赛?关于什么#id1 + #id2 #id3?
是否有这意味着选择#id1 (#id2 + #id3)或(#id1 + #id2) #id3?(我假设(并且)在CSS选择器中不被允许,我在规范中没有看到它们)
在下面的示例中,我想创建一个CSS规则,该规则仅适用于带有文本"Blockhead"的标题.
<div class="gumby">
<span class="pokey"></span>
<h3>Blockhead</h3>
<h3>Clay rules</h3>
</div>
Run Code Online (Sandbox Code Playgroud)
我可以使用括号,例如(.gumby > .pokey) + h3?如果没有,我的替代方案是什么?
我一直相信(虽然我现在怀疑这些信念的有效性):
div.name
Run Code Online (Sandbox Code Playgroud)
速度比:
.name
Run Code Online (Sandbox Code Playgroud)
但是我最近读到大多数CSS选择器引擎从右到左读取,在这种情况下第一个例子实际上不会更慢?因为选择器引擎会简单地找到每个具有一个名称类的元素,然后必须识别哪些是divs?
CSS选择器引擎通常以哪种方式读取?从左到右还是从右到左?如果他们一般从右到左阅读,有人可以请我解释为什么(我看不出在选择引擎方面从右到左阅读是否有意义)?
以下选择器是什么意思?
.a .b + .c .d { ... }
Run Code Online (Sandbox Code Playgroud)
意图(以及它似乎起作用的方式):选择与d内部c相邻的b内部a
/* Brackets to hide ambiguity */
(.a .b + .c) .d
Run Code Online (Sandbox Code Playgroud)
这是正确使用邻接兄弟选择器吗?+CSS语法中的运算符优先级是什么?