1

タグ名をセレクター内に保持する場合。

例えば:

#divMainContentBody { … }

.spanImportant { … }

IDとクラスは、参照している要素タイプをすでに示しているため、これにより、スタイルシートとマークアップを切り替える必要が最小限に抑えられます。


@Guffaの回答後に更新:

代替テキスト

この本でもこのアドバイスを見つけましたhttp://answers.oreilly.com/topic/647-how-to-write-efficient-css-selectors/

IDセレクターを修飾しない

Because there is only one element in the page with a given ID, there’s

修飾子を追加する必要はありません。たとえば、DIV #tocは不要であり、#tocに簡略化する必要があります。

クラスセレクターを修飾しない

Instead of qualifying class selectors for specific tags, extend

ユースケースに固有のクラス名。たとえば、LI .chapterを.li-chapterに変更します。さらに、.list-chapterに変更します。

4

2 に答える 2

5

この中で識別子を接頭辞として付けることはハンガリアン記法と呼ばれ、その使用に不可欠であると考えられる識別子の側面に使用されます。

ほとんどの場合、要素タイプはCSSの識別子にするのに十分重要ではないと思います。名前が適切に選択されている場合は、それらから重要な情報をすでに判別できるはずです。

要素が重要な場合は、識別子に入れる代わりにセレクターで使用できます。そうすれば、セレクターは実際にはその要素でのみ機能します。

div#MainContentBody { ... }

span.Important { ... }
于 2010-04-17T10:48:46.550 に答える
2

私の見解では、これは、場所に依存するスタイルを使用したり、CSSを場所ベースのパターンに「トレンド」したりするためのベストプラクティスではない可能性があります(つまり、「これはスパンにのみ使用できます」、「これはdivにのみ使用できます」 )HTML要素とCSSクラスの間に1:1の関係を作成するように強制します。

CSSクラスには適切な名前が付けられています。これは、オブジェクト指向プログラミングの場合と同様に、CSSクラスを相互に継承させることができるためです。この目的を達成するためのより良いアプローチは、意味のある命名規則を維持することですが(すでに提案したように)、モジュール式で拡張可能なクラスを作成します。

その結果、スタイルシートの動作を継続的にオーバーライドしなくても、1つのクラスをさまざまな方法や場所で使用できるようになります。これにより、スタイルがより予測可能になり、CSSがはるかに保守しやすくなります。

詳細については、http: //wiki.github.com/stubbornella/oocssまたはSlideShareをご覧ください。

于 2010-04-17T10:51:05.950 に答える