CSS 类名的问题详解
2019-06-06 16:25
381 查看
以下以数字开头的 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 类名的问题,希望对大家有所帮助,如果大家有任何疑问请给我留言,
相关文章推荐
- div+css 背景图片的定位取图问题详解
- CSS浏览器兼容问题详解
- CSS浏览器兼容性问题详解
- CSS盒模型(Box Model)问题详解
- jsp.html中的引入js.css文件的问题,以及文件路径详解。
- 转 div+css 背景图片的定位取图问题详解
- CSS —— html元素类型与居中问题详解
- css position: absolute、relative定位问题详解
- Css_Backgroud-position(背景图片)定位问题详解
- 解决不同浏览器对css支持问题详解
- CSS中Backgroud-position(背景图片)定位问题详解
- CSS浏览器兼容性问题详解总结
- CSS边界线消失的问题详解
- CSS 优先级问题详解
- CSS:html/css教程:背景图片的定位问题详解
- CSS教程 CSS盒模型(Box Model)问题详解
- 详解CSS中的选择器优先级及样式层叠问题解决
- 详解关于html,css,js三者的加载顺序问题
- jsp.html中的引入js.css文件的问题,以及文件路径详解。
- CSS 类名的问题