Can we specify custom data attribute values in CSS?

Question

On elements I can specify the data attributes as, e.g.

<div data-widget-type="MyWidgetType1" data-property1="20" data-property2="test">
...
</div>

I want to capture these in a class e.g.

.MyClass1 {
 data-widget-type:"MyWidgetType1";
 data-property1:"20";
 data-property2:"test";
}

<div class="MyClass1">
...
</div>

Is there a way to specify data attribute values in CSS?

Answer 1

No, there is no such functionality even for default attributes (like you can't set name attribute via CSS). But you can select these custom attributes:

.MyClass1[data-widget-type="MyWidgetType1"]