<html>
<head>
<style>
#1fineday {
color:yellow;
}
</style>
</head>
<body>
<h1>Welcome</h1>
<div class="intro">
<p id="1fineday">Hello World</p>
</div>
</body>
</html>
"Hello World"
不应该是黄色的吗?我不明白为什么我编写的内部 CSS 样式不适用。ID
是1fineday
.我一定忽略了什么。
由于命名约定,您的id
不能以数字开头
<html>
<head>
<style>
#fineday {
color: yellow;
}
</style>
</head>
<body>
<h1>Welcome</h1>
<div class="intro">
<p id="fineday">Hello World</p>
</div>
</body>
</html>
删除数字1
它将起作用
供参考:
W3学校: https://www.w3schools.com/css/css_syntax.asp
CSS技巧:https://css-tricks.com/ids-cannot-start-with-a-number/
使用#
字符编写 CSS 选择器的方式存在技术性。您始终可以编写选择器以使用属性选择器
[id="1fineday"] {
color:yellow;
}
你会看到黄色的文字。
你不能在选择器中写#1fineday
,因为,正如官方的CSS选择器规范所说:
文档语言的 ID 类型属性允许作者将标识符分配给文档树中的一个元素实例。ID 选择器包含一个"数字符号"(U+0023,#(,紧跟 ID 值,该值必须是 CSS 标识符。ID 选择器表示具有与 ID 选择器中的标识符匹配的标识符的元素实例。
CSS标识符的语法在官方规范中给出,这些词:
在 CSS 中,标识符(包括选择器中的元素名称、类和 ID(只能包含字符
[a-zA-Z0-9]
和 ISO 10646 字符 U+00A0 及更高,以及连字符 (-
( 和下划线 (_
(;它们不能以数字、两个连字符或连字符后跟数字开头。标识符还可以包含转义字符和任何 ISO 10646 字符作为数字代码(请参阅下一项(。例如,标识符"B&W?"可以写成"B\&W\?"或"B\26 W\3F"。
因此,如果您仍想使用#
,则必须使用数字 1 的转义码:
#31 fineday {
color:yellow;
}
感谢评论中指出后一个技巧的误解,并注意到 id 和属性选择器之间的特异性规则不同。