我们可以在CSS中指定自定义数据属性值吗?

前端之家收集整理的这篇文章主要介绍了我们可以在CSS中指定自定义数据属性值吗?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
在元素上,我可以指定数据属性,例如,
<div data-widget-type="MyWidgetType1" data-property1="20" data-property2="test">
...
</div>

我想在一个类中捕获它们,例如

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

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

有没有办法在CSS中指定数据属性值?

解决方法

CSS不是HTML.您无法使用CSS设置或更改HTML属性的值.

此外,你为什么要这样做?由于关注点分离,存在HTML和CSS. HTML用于内容,CSS用于演示.在CSS中指定数据属性与在HTML中指定表示属性没有什么不同.

如果您正在尝试将元数据分配给类名,然后该类名应用于具有该类名的所有元素,那么(再次)完全超出CSS的范围,并且在HTML中根本不可能.将元数据分配给元素的唯一方法是将其指定为该元素的属性. (如果您不想在标记中指定该类的每个实例上的属性,则可以将属性声明移动到脚本,但是在一天结束时,脚本仍然必须使用这些值填充每个元素的数据集.但是,根据您的需要,这可能就足够了.)

猜你在找的CSS相关文章