一尘不染

ID中带有句点的CSS选择器

css

HTML规范允许在ID中使用句点(。):

<img id="some.id" />

但是,使用CSS ID选择器规则将 无法 正确匹配:

#some.id { color: #f00; }

ID选择器的CSS规范没有提到这种情况。因此,我假设它使用的是标记名和类选择器的组合?例如,CSS规则a.className适用于<a>类名称为的所有锚定标记()className,例如<aclass="className"></a>

是否可以有一个外部CSS文件规则,该规则通过其中包含句点的ID引用HTML元素?

我不希望这样,因为CSS规范指定CSS“标识符”不包含句点作为有效字符。那么,这是HTML和CSS规范之间的根本不匹配吗?我唯一的选择是使用不同类型的CSS选择吗?有谁能比我更聪明地确认或否认这一点?

(为了简化起见,我会从HTML id属性中删除句点,但这是系统生成的id,因此在这种情况下,我无法更改它。)


阅读 374

收藏
2020-05-16

共1个答案

一尘不染

经典。在仔细研究了编写问题的所有规范之后,我通读了更多内容,发现其中有一个转义字符。我以前从未用过它,但是CSS规范确实允许像大多数语言一样转义反斜杠(\)。你知道什么?

因此,在我的示例中,以下规则将匹配:

#some\.id { color: #f00; }

2020-05-16