これは非常に一般的な状況です。いくつかのマークアップがあるとしましょう:
<div class="widget">
<div class="widget-item"></div>
</div>
.widget-item
2 つのオプションでスタイルを設定できます。
オプション 1: 親クラスを使用したプレフィックス
.widget .widget-item { /* styles */ }
オプション 2: クラスに直接アクセスする
.widget-item { /* styles */ }
プレフィックスに大きなパフォーマンス上の利点/ヒットはありますか?
クラスを別のコンテナーで再利用する必要がない場合、たとえば.other .widget-item
、プレフィックスに実際の利点はありますか? (ほとんどの場合、親の外部でクラスを再利用する必要さえないので、機能的に違いはありませんか?)
私はこれらの深いセレクターを使用していることに気づきました。
この男は、深くネストする必要があると言います: http://coryschires.com/why-you-should-deeply-nest-your-css-selectors/
この男は、それらをネストせずにシンプルにしておくべきだと言っています: https://github.com/csswizardry/CSS-Guidelines#selectors
これが重複している場合はご容赦ください。見つけられなかったようです。