带有CSS的数据属性就没那么有用了

Data attributes with CSS not so useful?

本文关键字：有用 CSS 数据属性 带有      更新时间：2023-09-26

我遗漏了什么吗？这个MDN示例乍一看非常有用：

article[data-columns='3'] {
  width: 400px;
}
article[data-columns='4'] {
  width: 600px;
}

但这与使用没有什么不同

article[myAttr='3']{...或article.cols3{...

使用javascript/jQuery可以非常容易地操作这两种方法。

非常强大的是：

article[data-fieldwidth]{
 width: data-fieldwidth;
}

但这在任何地方都没有描述，在我的任何测试中都不起作用。这是正确的吗？

如果要获取属性的值，应该使用CSS attr函数。目前，该房产的价值尚未评估，而是按原样设置。

article[data-fieldwidth] {
 width: attr(data-fieldwidth);
}

但请注意：

attr()函数可以与任何CSS属性一起使用，但对content（属性）以外的属性的支持是实验性的。

相关文章：