CSS定义中的逗号是什么意思[重复]答案

【问题标题】：What does comma in CSS definition mean [duplicate]CSS定义中的逗号是什么意思[重复]
【发布时间】：2015-06-03 00:17:00
【问题描述】：

这种类型的 CSS 定义是什么意思？注意前两个类用逗号分隔，后两个用逗号分隔。

.Container .layout, .groupContainer
{
  width: 100%;
}

【问题讨论】：

标签： css

【解决方案1】：

逗号分隔选择器，允许一组 CSS 样式应用于多个不同的组。在您发布的 CSS 中：

.Container .layout,
.groupContainer {
  width: 100%;
}

width: 100% 将应用于Container 类元素内的layout 类元素，以及groupContainer 类元素。

参考资料：

【讨论】：

【解决方案2】：

是的快捷方式

.groupContainer
{
   width: 100%;
}
.Container .layout
{
   width: 100%;
}

你应该使用它来对你的 CSS 进行分组

【讨论】：

【解决方案3】：

如上所述，它有助于跨多个选择器对单个 CSS 声明进行分组，并有助于节省文件大小（随着 CSS 文件变大，这会非常方便！）并使内容更清晰易读。

例如，您可以有多个具有相同声明的选择器：

.div1 {
    color: red;
}
.div2 {
    color: red;
}
.div3 {
    color: white;
}
.div4 {
    color: white;
}

您可以使用以下方法缩短它：

.div1,.div2 {
    color: red;
}
.div3,div4 {
    color: white;
}

【讨论】：

如果只是添加到其他答案中，作为评论是否更有意义？
你为什么没有对其他答案这么说？
公平地说，很难在注释空间中提供这么多代码 - 清晰易读。
因为我觉得我的答案提供了比没有答案更重要的东西（关于文件大小）。
@Lee 我只是说，由于您专门引用了其他答案，因此作为评论可能更有意义。添加的内容可以放在评论中，因为您的两个示例之间的差异已经得到证明。这绝不是故意的恶意或粗鲁，所以请不要这样认为。我只是提个建议。

【解决方案4】：

逗号用于分组，当相同的规则适用于多个选择器时。每个选择器都完全独立于其他选择器。

空格用于选择.container内的任何.layout，即使它们之间还有其他元素。 p>

对于你的问题，答案是：

您将 .container 类和 .groupContainer 内的 .layout 分组，宽度值都是 100%。

【讨论】：