2012-02-19 9 views
0

私は正しく覚えているかどうかはわかりませんが、CSSルールでセレクタを使用しているのは悪い習慣でしたが、誰かがこのトピックについていくつかの光を放つことができますか?例えばCSSで子セレクタ(>)を使用するのに問題がありますか?

:あなたは、あなたがそれを使用することができない古いブラウザをサポートする必要があるので、もし

<style> 
#search-form { 
... whatever rules... 
} 
#search-form > input[type=text] { 
... rules... 
} 
#search-form > button { 
... rules ... 
} 
</style> 
<form id="search-form"> 
    <input type="text" placeholder="Search..."> 
    <button>Search!</button> 
</form> 
+1

(http://www.w3.org/TR/CSS2/selector.html#child-selectors)[ '>は'ツールです] 。他のツールと同様に、誤って、不適切に、または不正確に、または理解が不足して使用されると、結果が予期しないものになる可能性があります。 –

答えて

2

これは確かに悪いことではありませんが、利点と欠点の知識が必要です。子セレクタ(E > F)を使用すると直下の子のみが選択され、完全な子孫トラバーサルが行われないため、ブラウザに子孫セレクタ(E F)を適用する時間がかかりません。しかし、この要素はIE6ではサポートされていません。

これは良い書き込みアップといくつかの素晴らしいリンクがあります:CSS child vs descendent selector

1

>セレクタが、IE6ではサポートされていません。それ以外

http://caniuse.com/#feat=css-sel2

、それを使用しない理由はありません。

+0

それは確かに(古いアドバイスに基づいて)アイデアがどこから来たのかもしれません。 –

1

子セレクタは、左側のセレクタの直下の子孫にのみ一致します。それはあなたが望むかもしれないし、そうでないかもしれないが、左のセレクターの下にどれほど深いかにかかわらず、すべての子孫に特定のスタイルを適用する方がより一般的です。

#mydiv > span自分自身に質問してください:とpの中の#mydivに一致させたくありませんか? lispanはどうですか?#mydiv?その他おそらくあなたはそうではありません - おそらくあなたがします。重要な部分はunderstand what it doesです。

関連する問題