有没有理由说CSS从数字开始不支持id和类？

Question

我注意到,如果id或类从number开始,则不应用css属性.例如,以下都不起作用:

.1ww{
    /* some properties here */
}

和

.1{
    /* some properties here */
}

和

#1{
    /* some properties here */
}

和

#1ww{
    /* some properties here */
}

为什么CSS不支持ID或类名,从数字开始？(例如,Javascript适用于数字ID和类)

Answer 1

ID和类必须是有效的标识符.

标识符在规范中列出如下:

ident       -?{nmstart}{nmchar}*

所以一个可选的-标志,然后是nmstart,随后是任意数量的nmchars.

我们感兴趣的是nmstart,但我也会列出nmchar:

nmstart     [_a-z]|{nonascii}|{escape}
nmchar      [_a-z0-9-]|{nonascii}|{escape}

而且只是为了完整性:

nonascii    [\240-\377]
escape      {unicode}|\\[^\r\n\f0-9a-f]
unicode     \\{h}{1,6}(\r\n|[ \t\r\n\f])?

好了,与所有的出路,注意一下nmstart它没有包括0-9或-.这意味着根据CSS规范,ID和类不能以数字开头.事实上,他们甚至无法入手-1.或两个连字符.

这就是您的代码中无法识别它们的原因.

Answer 2

实际上,规范声明以数字开头的类将被解释为维[ 1 ]:

CSS2立即解析一个数字,后面跟一个标识符作为DIMENSION标记(即一个未知单元),CSS1将其解析为数字和标识符.这意味着在CSS1中,声明'font:10pt/1.2serif'是正确的,'font:10pt/12pt serif'也是如此; 在CSS2中,在"serif"之前需要一个空格.(有些UA接受了第一个例子,但不是第二个例子.)

由于我们不知道将来会引入哪些维度,因此CSS中不存在的维度将被解析为未知维度:

在CSS1中,类名可以以数字(".55ft")开头,除非它是一个维度(".55in").在CSS2中,此类被解析为未知维度(以允许将来添加新单元).要使".55ft"成为有效的类,CSS2需要转义第一个数字(".\ 35 5ft")

你可以通过转义第一个数字来使用以数字开头的类,这个数字根据W3C CSS验证器是有效的.看看plunkr.

[ 1 ]附录G. CSS的语法2.1

Answer 3

虽然使用数字启动Id和类名称不是一个好习惯,但您可以通过使用以下语法从css中访问这些元素

[class="1ww"] 
{
    /* some properties here */
}

要么

[id="1"]
{
    /* some properties here */
}