css - 使用嵌套选择器有什么真正的优势吗？

Question

如果 #div2 包含在 #div1 中，那么在 css 样式表中引用它有什么真正的好处吗？像这样:

#div1 {
  display:block; 
}

#div1 #div2 {
 background-color:#e0e0e0;
}

然后类似的。我有一个表格 ID，然后是表格标题

#myTable {
    width:100%;
}
#myTable #productName{
   width:75%;
}

Answer 1

唯一的优点是您可以更加具体，例如创建一个规则，仅当某些元素放置在另一个元素中时才适用于该元素。但在大多数情况下，没有理由这样做，并且它可能会损害您的 css 的性能(另外它会创建代码重复，以防您想要更改父 ID)。

在您的情况下，选择器是 ID，并且由于每个 ID 只能有一个元素，因此嵌套选择器的优势更少，您可能不需要它们。

阅读this article以获得更深入的解释。