以下以数字开头的 CSS 类名不会生效:

.1st{
    color: red;
}

一个合法的 CSS 类名必需以下面其中之一作为开头:

• 下划线 _
•短横线 -
•字母 a - z

然后紧跟其他 _ , - 数字或字母。

用正则表示,一个合法的 CSS 类名为:
 

-?[_a-zA-Z]+[_a-zA-Z0-9-]*

另,根据CSS 标准 中的描述,如果类名开头是短横线 - ,第二个字符必需是下划线 _ 或字母,但实测发现,除了提及的两个,紧跟另一个短横线也是生效的。

以下是测试代码及结果:

<p class="1st">should apply red color</p>
<p class="-1foo">should apply red color</p>
<p class="-_foo">should apply red color</p>
<p class="--foo">should apply red color</p>
<p class="-foo">should apply red color</p>
<p class="foo">should apply red color</p>
.1st {
  color: red;
}
.-1foo {
  color: red;
}
.-_foo {
  color: red;
}

.--foo {
  color: red;
}

.-foo {
  color: red;
}
.foo {
  color: red;
}

CSS 类名的问题详解 

不同类名实际效果

总结

以上所述是小编给大家介绍的CSS 类名的问题详解,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!

标签:
css,,类名

免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
岱庙资源网 Copyright www.zgmyg.com

评论“CSS 类名的问题详解”

暂无“CSS 类名的问题详解”评论...

RTX 5090要首发 性能要翻倍!三星展示GDDR7显存

三星在GTC上展示了专为下一代游戏GPU设计的GDDR7内存。

首次推出的GDDR7内存模块密度为16GB,每个模块容量为2GB。其速度预设为32 Gbps(PAM3),但也可以降至28 Gbps,以提高产量和初始阶段的整体性能和成本效益。

据三星表示,GDDR7内存的能效将提高20%,同时工作电压仅为1.1V,低于标准的1.2V。通过采用更新的封装材料和优化的电路设计,使得在高速运行时的发热量降低,GDDR7的热阻比GDDR6降低了70%。