具有特定数据属性的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>