为什么将 :root 用于 css 变量而不是 html 被视为最佳实践？
Why is using :root for css variables instead of html considered as best practice?
我在 MDN、CSS-Tricks、Whosebug 和 Mozilla- :root doc
上搜索并阅读了多篇文章
In HTML, :root represents the <html> element and is identical to the selector html, except that its specificity is higher.
:root can be useful for declaring global CSS variables
在 Mozilla - Css Variables page 上它说这是一个常见的最佳实践：
A common best practice is to define custom properties on the :root pseudo-class, so that it can be applied globally across your HTML document:
更新
几乎所有其他来源，包括之前在 Whosebug 上提出的两个问题，例如
- CSS is used for SVG, XML etc. - What is the benefit of using :root CSS selector instead of html CSS selector?
告诉我们应该将 CSS 变量放在 :root 伪 class 中，它们只是突出显示差异，例如 css-tricks select the document’s top-most element:
However, since CSS is a styling language that can be used with other document formats, such as SVG and XML, the :root pseudo-class can refer to different elements in those cases. Regardless of the markup language, :root will always select the document’s top-most element in the document tree.
在我看来，我们可以跨多个文件和项目使用 :root 变量，不管它是什么，它可能是 SVG，XML 并且它在 CSS 选择器。
我的问题是：为什么它被认为是 Web 开发的最佳实践？是什么让它成为最佳实践？我们在这里需要更高的特异性吗？是否存在我们在浏览器中将 XML 或 SVG 作为 Web 应用程序启动的情况？
我其实也不清楚为什么 MDN（或者更具体地说，在 MDN 上写那段话的人）也称其为“最佳实践”。我最多称其为会议。正如链接帖子所述，CSS 被写入文档 language-agnostic，因此规范作者不能使用 HTML-specific 术语和选择器，除非相关内容特定于 HTML .这就是它的全部内容，在涉及 root-level 自定义 属性 定义时，实际上没有任何东西可以使 :root 本质上比类型选择器更好。您或任何其他人必须编写可跨不同文档语言移植的样式表，以至于您 需要 为您的自定义属性使用 :root 的可能性微乎其微。 （也许某些全局属性需要在同一个项目中由 HTML 和 SVG 共享？在过去的 5 年里有人必须这样做吗？）
如果额外的特殊性让您非常困扰，当然可以使用 html。您的自定义属性仍将在 HTML 文档的上下文中工作，如果您像绝大多数其他开发人员一样，仅将 CSS 与 HTML 一起使用，这将不是问题.不过，您实际上并没有从中获得太多好处。由于特异性仅在一次将冲突样式应用于单个元素的上下文中相关，因此如果您混合使用 html 和 :root 样式规则，或者您有一些组合，它只会成为一个问题html 和其他简单选择器，例如 class 或属性选择器，甚至其他可能会干扰 :root.
的 pseudo-classes
我的建议 I impart with most situations surrounding HTML/CSS 是要保持一致。但是，是否要与 最佳实践 约定一致并使用 :root 或使用 html 完全取决于您，前提是您明白自己为什么这样做so and doing so does not going through other developers who may be reading or work with your CSS and already used to the best practice convention.
Is there any case in which we launch an XML or SVG as a web app in the browser?
当然，XML 运行 在浏览器中很常见。
SVG？ XML.
RSS订阅？ XML.
XHTML 服务于 application/xhtml+xml？ XML.
许多专有 XML-based 技术使用 XSL 进行样式化或将 XSLT 转换为 XHTML，后者又使用 CSS。火狐浏览器本身uses/used（我记不清了）XUL，它又使用CSS，所以浏览器UI本身是使用渲染的CSS.
当然，RSS 不使用 CSS； SVG 和 XHTML 当然可以。当然，几乎没有人使用 application/xhtml+xml。但这仍然留给我们无处不在的 SVG。虽然我不会将 SVG 称为“网络应用程序”，但只要您使用 <img> 元素、CSS 显示 SVG，甚至只是通过在浏览器中打开文件或数据 URI，您就在事实上 运行 一个，浏览器正在使用其布局引擎渲染它，就像渲染 HTML.
时一样
我在 MDN、CSS-Tricks、Whosebug 和 Mozilla- :root doc
上搜索并阅读了多篇文章In HTML, :root represents the
<html>element and is identical to the selector html, except that its specificity is higher.
:root can be useful for declaring global CSS variables
在 Mozilla - Css Variables page 上它说这是一个常见的最佳实践：
A common best practice is to define custom properties on the
:rootpseudo-class, so that it can be applied globally across your HTML document:
更新
几乎所有其他来源，包括之前在 Whosebug 上提出的两个问题，例如
- CSS is used for SVG, XML etc. - What is the benefit of using :root CSS selector instead of html CSS selector?
告诉我们应该将 CSS 变量放在 :root 伪 class 中，它们只是突出显示差异，例如 css-tricks select the document’s top-most element:
However, since CSS is a styling language that can be used with other document formats, such as SVG and XML, the :root pseudo-class can refer to different elements in those cases. Regardless of the markup language, :root will always select the document’s top-most element in the document tree.
在我看来，我们可以跨多个文件和项目使用 :root 变量，不管它是什么，它可能是 SVG，XML 并且它在 CSS 选择器。
我的问题是：为什么它被认为是 Web 开发的最佳实践？是什么让它成为最佳实践？我们在这里需要更高的特异性吗？是否存在我们在浏览器中将 XML 或 SVG 作为 Web 应用程序启动的情况？
我其实也不清楚为什么 MDN（或者更具体地说，在 MDN 上写那段话的人）也称其为“最佳实践”。我最多称其为会议。正如链接帖子所述，CSS 被写入文档 language-agnostic，因此规范作者不能使用 HTML-specific 术语和选择器，除非相关内容特定于 HTML .这就是它的全部内容，在涉及 root-level 自定义 属性 定义时，实际上没有任何东西可以使 :root 本质上比类型选择器更好。您或任何其他人必须编写可跨不同文档语言移植的样式表，以至于您 需要 为您的自定义属性使用 :root 的可能性微乎其微。 （也许某些全局属性需要在同一个项目中由 HTML 和 SVG 共享？在过去的 5 年里有人必须这样做吗？）
如果额外的特殊性让您非常困扰，当然可以使用 html。您的自定义属性仍将在 HTML 文档的上下文中工作，如果您像绝大多数其他开发人员一样，仅将 CSS 与 HTML 一起使用，这将不是问题.不过，您实际上并没有从中获得太多好处。由于特异性仅在一次将冲突样式应用于单个元素的上下文中相关，因此如果您混合使用 html 和 :root 样式规则，或者您有一些组合，它只会成为一个问题html 和其他简单选择器，例如 class 或属性选择器，甚至其他可能会干扰 :root.
我的建议 I impart with most situations surrounding HTML/CSS 是要保持一致。但是，是否要与 最佳实践 约定一致并使用 :root 或使用 html 完全取决于您，前提是您明白自己为什么这样做so and doing so does not going through other developers who may be reading or work with your CSS and already used to the best practice convention.
Is there any case in which we launch an XML or SVG as a web app in the browser?
当然，XML 运行 在浏览器中很常见。
SVG？ XML.
RSS订阅？ XML.
XHTML 服务于 application/xhtml+xml？ XML.
许多专有 XML-based 技术使用 XSL 进行样式化或将 XSLT 转换为 XHTML，后者又使用 CSS。火狐浏览器本身uses/used（我记不清了）XUL，它又使用CSS，所以浏览器UI本身是使用渲染的CSS.
当然，RSS 不使用 CSS； SVG 和 XHTML 当然可以。当然，几乎没有人使用 application/xhtml+xml。但这仍然留给我们无处不在的 SVG。虽然我不会将 SVG 称为“网络应用程序”，但只要您使用 <img> 元素、CSS 显示 SVG，甚至只是通过在浏览器中打开文件或数据 URI，您就在事实上 运行 一个，浏览器正在使用其布局引擎渲染它，就像渲染 HTML.