CSS:CSS 选择器中的通配符

Question

我试图针对一些特定的禁用文本框来改变文本的颜色。 ID的格式是:

id="jc-cr-lmid-Total-1-RangeFr"

数字根据屏幕上文本框的数量从 1 到 5 变化。

有没有办法在保留选择器的 -RangeFr 部分的同时为数字插入通配符？

我试过:

id*=["jc-cr-lmid-Total-*-RangeFr"]:disabled{
  //Change text color
}

但这并没有奏效

Answer 1

是的，有点；您可以使用 attribute-starts-with 和 attribute-ends-with 表示法:

[id^="jc-cr-lmid-Total-"][id$="-RangeFr"]:disabled{
  //Change text color
}

但请注意，由于 CSS 没有正则表达式的概念，因此这允许所需的开始和结束之间的任何字符序列，因此它将匹配:

• id="jc-cr-lmid-Total-1-RangeFr"
• id="jc-cr-lmid-Total-1000-RangeFr"
• id="jc-cr-lmid-Total-anyOtherSequenceOfCharacters-RangeFr"

老实说，您最好为此简单地使用一个类，这样会更加简单可靠。

引用资料:

• > CSS attribute selectors .