【问题标题】:Is :root really useless?:root 真的没用吗?
【发布时间】:2018-01-05 08:48:06
【问题描述】:

我知道:root 可用于为 HTML 文件选择 html 标记并为svg 文件选择svg 标记(关于样式化 XML 文件,这真的很奇怪,不适用于我),但我认为选择 :root 而不是 htmlsvg 选择器是没有意义的。使用 :root 对 HTML 和 SVG 应用相同的样式对我来说似乎很奇怪。我确信这不是现实的情况。

:root I found 唯一有效的应用是它可以用来覆盖 html 样式(因为伪类选择器比类型选择器具有更高的优先级),但我会避免经常覆盖 html 并放置为了避免这种需要,稍后会链接特定的 CSS 文件。

所以问题是::root 在现实世界中的应用是否不仅仅是html(或svg 用于SVG 文件)的奇怪替代方案?

【问题讨论】:

    标签: html css css-selectors pseudo-class


    【解决方案1】:

    对于绝大多数使用 HTML 的作者来说,:roothtml 之间只有两个实际区别:

    1. :root 是一个伪类,更具体。如果您对类型选择器的特殊性要求较低,则完全可以使用html 而不是:root
    2. :root 可用于隐藏 Internet Explorer 8 及更早版本的规则(这种用例可能在 2017 年并不流行,但在 5 年前相当普遍)。

    除此之外,:root 伪类确实主要用于匹配任意文档中的根元素而无需知道元素类型的用例,这意味着基于 XML 的语言甚至其他,非基于 XML 的文档类型。请记住,从第 3 级开始,Selectors 模块设计用于各种文档语言的各种用途,而不仅仅是使用 CSS 样式化 HTML 元素(这就是为什么它现在简称为“Selectors”而不是“CSS Selectors”,尽管它是一个 CSS 模块)。

    此外,对于根元素没有自己的类型的宿主语言(例如,在element 可能既是根元素并且嵌套的语言中),:root 是区分根元素与嵌套元素(尽管存在替代方案,例如 :not(:nth-child(n)) 在选择器 3 中具有相同的特异性,或 :not(* > *) 在选择器 4 中具有特异性)。

    【讨论】:

    • 关于 case#2 我会使用条件 cmets 来为 IE8- 应用特定规则。默认使用 IE8 样式并在其他浏览器中覆盖它似乎是非常错误的方法。
    • @Vadim Ovchinnikov:是的,我也这样做,很少使用选择器黑客。然而,许多其他作者使用它们,这是一种常用的 hack 示例。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2016-11-21
    • 2012-09-14
    • 1970-01-01
    • 2015-12-04
    • 2018-07-04
    • 2011-04-01
    相关资源
    最近更新 更多