CSS中的双斜线注解有多可靠?[已关闭]

bvjveswy  于 2023-01-03  发布在  其他
关注(0)|答案(1)|浏览(166)

已关闭。此问题为opinion-based。当前不接受答案。
**想要改进此问题吗?**请更新此问题,以便editing this post可以用事实和引文来回答。

四年前关闭了。
Improve this question
在CSS中,单行注解的双斜线有多可靠?使用这样的单行注解有什么经验?

ar7v8xwq

ar7v8xwq1#

使用双斜线//的注解在CSS中是无效的。CSS规范仅对注解作了如下说明:

    • 4.3.2.使用注解**

这一节描述了如何从代码点流中使用注解。它什么也不返回。
如果接下来的两个输入代码点是U +002F SOLIDUS(/)后跟U +002A ASTERISK(),则使用它们以及后面的所有代码点,直到(包括)第一个U +002A ASTERISK()后跟U +002F SOLIDUS(/),或者直到EOF代码点。返回此步骤的开始。
如果前面的段落以使用EOF代码点结束,则这是一个分析错误。
不返回任何内容。
换句话说,只有/* */是有效注解,它没有提到//
但是,//在某些CSS处理器(如Less和SASS)中有效。
根据您的评论:
...你能依靠浏览器来理解这是一条评论吗
不,浏览器将尝试解释语法,并可能由于它是语法错误而不是注解而导致规则失败。结果可能会因浏览器而失败,但使用它会导致未定义的行为。

带有双斜线注解的浏览器行为

以下是在不同浏览器中应用以下规则的结果:一种样式在属性的开头使用双斜杠,另一种样式在值的正前方使用//

#some {
    width: 500px;
    /*height: 400px;*/
    //color: blue;
    background-color: //red;
}

火狐

Firefox ESR 52.9.0中,您会在colorbackground-color旁边看到一个黄色警告三角形,因为//color是一个无效的CSS属性,并且//red是一个无效的background-color值。
chrome 合金

有趣的是,在Chrome68.0.3440.106中,我甚至没有看到//color: blue出现在元素面板中,这可能意味着Chrome试图将该行视为注解,但由于//作为注解不在规范中,因此您不应依赖它。

野生动物园

    • Safari 11.1.2**的行为与Chrome相同,其中// led属性甚至没有列出,// led值是语法错误。

互联网浏览器11

    • Internet Explorer 11.0.9600.19080**将整个//color: blue视为规则属性,并认为它没有值,就像您编写了//color: blue: ;一样。它还列出了background-color: //red,但认为它是错误的,因此不应用它。

还应注意,对于以下情况:

#some {
    // width: 400px;
    /* height: 400px; */
}

大多数浏览器至少会承认/* */属性,并允许你在开发工具中切换它。对于Chrome和Safari,// led规则甚至没有列出,这意味着你不能/* */那样切换它。

相关问题