css 名称中应该包含层次结构吗？

Question

在 css 名称中包含层次结构方面的“最佳实践”是什么？EG：假设我们有以下 html：

<div class="foo">
<div class="$className2">
<div class="$className3">123
</div>
</div>
</div>

$className2 是否应该包含“foo-”作为前缀，而 $className3 是否应该包含“foo-”和 $className2 作为前缀？或者父类名称不应该包含在子类名称中吗？

Answer 1

很简单，您是否会重用这些类名，或者您是否会在同一类型结构之外的任何地方重用这些类名？如果没有，那么父母就没有必要限制它。但是，如果您是这样，那么最好通过包含其父节点选择器来显式指示哪个子元素是哪个子元素。