CSS选择器不能匹配数值属性值？为什么？ [英] CSS selectors cannot match numerical attribute values? why?
问题描述
我设置了一个简单的测试页来说明我遇到的问题。
简单来说，这是按预期工作的（文本格式为粗体，下划线为红色）：
I have set up a simple test page to illustrate the problem I have encountered. Briefly, this works as expected (text is formatted in bold, underlined red):
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<style>
[abc=x1] {
color: red;
text-decoration: underline;
font-weight: bold;
}
</style>
</head>
<body>
<div abc=x1>hello</div>
</body>
</html>
这不是（文字保持黑色，没有应用格式）：
And this does not (text stays black, no formatting applied):
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<style>
[abc=1] {
color: red;
text-decoration: underline;
font-weight: bold;
}
</style>
</head>
<body>
<div abc=1>hello</div>
</body>
</html>
我在两个例子之间改变的唯一的事情是属性值（在CSS和HTML）从x1到1。
The only thing I changed between the two examples is the attribute value (in both the CSS and HTML) from x1 to 1.
所以看起来你不能匹配数值属性。
So it seems that you cannot match against numerical attributes.
为什么这个...非常有用...功能...存在？
Does anyone have any idea why this... very... useful... feature... exist?
推荐答案
in quote ...
Wrap the string to match in quotes...
[abc="1"] {
...
}
的的jsfiddle 。
属性值必须是CSS标识符或字符串。
Attribute values must be CSS identifiers or strings.
来源。
当您将其换成引号时，您要告诉它匹配 string 。
When you wrap it in quotes, you are telling it to match a string.
当不引用它时，它正在查找标识符
When you don't quote it, it is looking for an identifier.
在CSS中，标识符（包括元素名称，类别，并在选择的ID）只能包含字符[A-ZA-Z0-9]和ISO 10646字符U + 00A0和更高，加上连字符（ - ）和下划线（_）; 他们不能以数字开头，两个连字符或连字符后跟数字。
In CSS, identifiers (including element names, classes, and IDs in selectors) can contain only the characters [a-zA-Z0-9] and ISO 10646 characters U+00A0 and higher, plus the hyphen (-) and the underscore (_); they cannot start with a digit, two hyphens, or a hyphen followed by a digit.
这篇关于CSS选择器不能匹配数值属性值？为什么？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
