我想知道CSS是否可以实现以下目的:
HTML代码:
<span class="funny-elem" data-mystate="127">Hello World</span>
<span class="funny-elem" data-mystate="69">Hello Bird</span>
<span class="funny-elem" data-mystate="1337">Hello Nerd</span>
<span class="funny-elem" data-mystate="14">Hello What</span>
<span class="funny-elem" data-mystate="0">Hello Else</span>
...
CSS代码:
.funny-elem[data-mystate=">50"] {
color:#0f0;
}
.funny-elem[data-mystate="<50"] {
color:#f00;
}
上面的CSS代码当然不起作用,因为“大于”和“小于”符号在这里被解释为属性值。
但是,您知道一种选择数值属性值大于或小于特定数字的所有元素的方法吗?
不,纯CSS是不可能的。
可能的属性选择器是:
和W3对属性选择文档补充说:
属性值必须是CSS标识符或字符串。[CSS21]选择器中属性名称和值的区分大小写取决于文档语言。
因此,它们不是数字。无法使用任何数字比较。
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句