css - CSS セレクターのプロパティとしての attr

Question

重複の可能性:
スタイル属性による CSS セレクター

html:

<div data-family='arial'></div>

CSS では、このファミリーの値を使用したいと考えています。例：

div{font-family: attr(data-family)}

ファミリは任意の文字列にすることができます。どのように機能させるのですか？

Answer 1

このコードを試してください：

 div[data-weight="bold"]{
      font-weight: bold;
    }

http://www.w3.org/TR/selectors/#attribute-selectors

JSFIDDLE

Answer 2

純粋な CSS で求めていることを達成することはできません。jQuery を使用すると、次のように実行できます。

$.each($('div'), function(i, div) {
    $.each($(this).data(), function(key, val) {
        var realKey = key.replace(/([A-Z]{1})/g, '-$1').toLowerCase();
        $(div).css(realKey, val);
    })
})​

このデモを確認してください。

Answer 3

以下を使用できます。

div[data-weight="bold"] { font-weight: bold; }

しかし、JavaScript を使わずに属性をプロパティとして使用する方法はないと思います。