html - 具有特定数据属性的 div 选择器

Question

我正在尝试使用 CSS 专门选择具有特定数据属性的 div。我使用的数据属性是“data-id”，我尝试过的选择器是:

div['data-id'*="2"]
div[data-id="2"]
div['data-id'="2"]

没有任何作用。谁能帮助使用“data-id”属性使第二个 div 变为红色的工作选择器？感谢您的帮助。

div['data-id'*="2"] {
  color: red;
}
div {
  color: blue;
}

/* also fails:
div[data-id="2"]
div['data-id'="2"]
*/

<div data-id='1'>one</div>
<div data-id='2'>two</div>
<div data-id='3'>three</div>

Answer 1

应该是 data-id="2" 是的，这是可行的。

div[data-id="2"] {
  color: red;
}
div {
  color: blue;
}

/* also fails:
div[data-id="2"]
div['data-id'="2"]
*/

<div data-id='1'>one</div>
<div data-id='2'>two</div>
<div data-id='3'>three</div>