如何确定CSSOM (CSS对象模型)的根元素
我一直在研究浏览器呈现，我刚刚谈到了呈现过程中浏览器从原始CSS构建CSSOM的部分。
在我看到的所有教程中，作者似乎都假设/断言body元素是根，并且所有应用于主体的样式都将默认地应用于DOM的其余部分，除非被另一个选择器显式覆盖。这方面的一个例子是https://blog.logrocket.com/how-css-works-parsing-painting-css-in-the-critical-rendering-path-b3ee290762d3/
在这两种解释中-- body标记被假定为根，尽管html标记看起来应该是根。更重要的是，HTML规范似乎不需要标记中的任何一个标记(也许我误解了这一点)。
在我看来，当将样式应用到呈现树中的元素时，这似乎是一个非常重要的信息。如果不知道哪个元素是根元素，那么您就不知道样式应该如何相互级联。
所以我的问题是，浏览器总是假设主体元素是根，还是有方法来确定浏览器的CSS树中哪个元素应该是根元素？
回答 1
Stack Overflow用户
发布于 2020-01-16 19:01:55
这里有几个问题你正在混为一谈，所以很难把这个问题作为一个重复来结束，即使你自己提出的每一个问题都已经被问到了，并且已经得到了答案。所以我希望这能帮上忙！
如何确定CSSOM (CSS对象模型)的根元素
根只是文档的根元素，或者html，让我们不要误解它。
作者似乎假设body元素是根(..)这方面的一个例子是https://blog.logrocket.com/how-css-works-parsing-painting-css-in-the-critical-rendering-path-b3ee290762d3/
嗯，不。该页面上的示例使用"root“作为它所讨论的特定子树的顶部，该子树恰好位于<body>，但这是一个巧合；这个示例很可能是针对一个表，然后<table>将是”根“。
更重要的是，
规范似乎不需要标记中的任何一个标记(也许我误解了这一点)。
<html>和<body>的开始标记都是可选的，因此可以从HTML中省略它们。<head>也一样。但元素本身仍然存在！所有内容都在html元素中，开始标记与否。您可以通过加载HTML文档来测试这一点，例如
<title>title</title>
<div>Hello world</div>进入浏览器并检查它，您将看到div现在打包在body元素中，而标题位于head元素中。这是无可奈何的。
现在令人困惑的是，应用于body的某些(但不是所有) CSS样式由浏览器应用于html。例如，background-color；如果将其分配给主体，则整个浏览器窗口将被着色，而不仅仅是身体区域。
这是很久以前html元素不被认为是绘图画布时遗留下来的行为；它是不可样式的，只有主体具有样式属性(BGCOLOR、TEXT、LINK等)。尽管情况不再是这样，但出于兼容性的考虑，浏览器的行为仍然像它一样。
https://stackoverflow.com/questions/59774994
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号