html - CSS名称中应该包含层次结构吗？

在css名称中包含层次结构的“最佳实践”是什么？例如：，假设我们有以下HTML：

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

$classname2是否应包含'foo-'作为前缀，$classname3是否应同时包含'foo-'和$classname2作为前缀？或者父类名称不应该包含在子类名称中？

最佳答案

不需要包含父类的名称。css选择器将处理所需的任何父格式。
一个类，应该描述正在使用的内容类型。例如

<div class="sidebar">
<div class="error">
</div>
</div>

很可能您希望使用特定于错误类的格式，这与边栏类无关。如果您希望格式化特定于侧边栏的错误类，css选择器可以为您处理这个问题。

.sidebar > .error

或

.sidebar .error