如何为数据属性设置css [重复]

Posted 2023-03-06

【中文标题】如何为数据属性设置css [重复]

【英文标题】：how to css for data attribute [duplicate]

【发布时间】：2014-05-04 06:03:47

【问题描述】：

我想为我的数据属性创建 CSS。我知道之前和之后该怎么做，但它不适合之前和之后。我将成为我的图片标题，我想更改颜色、字体大小、字体系列等。

<a href="products/Comfo-Back-Adirondack-Chair.jpg" class="ilightbox" data-caption="Adirondack Chair, PATC2400, Size : 32” W x 36” D x 40” H"><img src="products/th/Comfo-Back-Adirondack-Chair.jpg" /></a>

查看 data-caption 这是一个未修复的值。如果修复，那么我可以，但它不能修复，但怎么办。有什么办法吗？

【问题讨论】：

奇怪的是，this question 并没有出现在建议列表中（我只是检查了自己）。我想知道为什么。

如果您想将样式应用于"Adirondack Chair, ..." 的值，您需要解释它是如何呈现的。单独的属性并不能做到这一点。这只是文本。

【参考方案1】：

使用以下按属性选择：

[data-caption] 
  /* rules */

如果您只想选择属性具有给定值的元素：

[data-caption="this is the value"] 
  /* rules */

在MDN阅读有关不同类型属性选择器的更多信息