2

私はhtml5boilerplateでそのようなコードを見つけました:

/**
 * Address styling not present in IE 7/8/9, Firefox 3, and Safari 4.
 * Known issue: no IE 6 support.
 */

[hidden] {
  display: none;
}

住所は?それは何に影響しますか?次の例のように属性が非表示になっている要素?

<div hidden></div>
4

3 に答える 3

4

はい、あなたの例とまったく同じです。セレクターは、属性を持つ任意の要素に一致しhiddenます (属性セレクターの前に暗黙のユニバーサル セレクターがあります)。

このhidden属性は HTML 仕様に新しく追加されたものであるため、古いブラウザーではサポートされていません。そのルールをスタイルシートに追加することで、その属性のネイティブな動作を効果的にポリフィルします (これは、設定と同様に、要素を非表示にすることは明らかですdisplay: none)。

IE6 の「既知の問題」は、IE6 が属性セレクターをサポートしていないことが原因です。

于 2013-01-22T09:05:34.700 に答える
3

hiddenは HTML5 の属性です

ここで詳細な説明を読んでください。ここでも良い説明を読んでください

コメントは、その CSS ソリューションは、デフォルトで新しい非表示の動作と互換性のないブラウザーに対処することであることを示唆しているようです。

于 2013-01-22T09:05:18.337 に答える
2

接頭辞「data-」を使用して独自の属性を作成することもできます。たとえば、Jquery Mobile はそれを使用します。

例 :

あなたのHTML

<div data-role="header" data-position="top">
   // content here
</div>

あなたのCSS

[data-role=header] 
{
     font-family:arial;
     font-size:20px;
}

[data-position=top]
{
     top:5px;
}

適切な説明はこちらにあります

W3C ドキュメント

于 2013-01-22T09:13:55.480 に答える