0

HTML

<div data-foo> ... </div>

CSS

div[data-foo]{ ... }

これは良い考えですか？欠点はありますか？

HTML マークアップのサイズが減少するため (要素ごとに -3 文字)、何百もの "foo" 要素がある場合、data- アプローチは理にかなっていると思います。

4

2 に答える 2

3
  • div[data-foo]古い IE ではサポートされていません (IE6、こちらを参照してください: http://www.quirksmode.org/css/selectors/ )
  • div[data-foo]セマンティックの意味が少ない
  • class="foo"data-fooDEFLATE-d の場合とほぼ同じスペースを占有します。サーバーをデフレートするように設定していない場合は、デフレートする必要があります。
  • class=foodata-foo非圧縮よりも 1 文字だけ長く、完全に有効な HTML です。
于 2013-03-31T14:13:30.123 に答える
1

たとえば、要素は異なる属性を持つ必要があるため、スタイルを定義し、いくつかを繰り返す必要があります。代わりに、宣言された属性セレクターを使用する代わりに、両方に使用できるクラスを使用しますプロパティからその属性を持つ要素まで、要素の属性の組み合わせに関係なく自由にクラスを使用できます

.class { /* You can use this anywhere you need these properties */
   font-family: Arial;
   font-size: 13px;
}

これは ELEMENT-ATTRIBUTE の組み合わせに制限されます

div[data-menu] { /* This will LIMIT you to a combination of div 
                    element having an attribute called data-menu */
    font-family: Arial;
    font-size: 13px;
}

重要：特異性はあなたを大混乱にします

于 2013-03-31T14:08:03.410 に答える