css - 如何参数化CSS选择器？

<分区>

可能题目有点乱，举个具体的例子

body.page-status .panel.panel-info .server .dot {
  font-size: 10px;
}

我也想申请这条规则

body.page-status .panel.panel-info .client .dot {
  font-size:10px;
}

如果仔细观察，2 个选择器之间的唯一区别是 .server 和 .client

我能否以某种方式将它们组合成一条规则？

谢谢

最佳答案

使用 comma to group selectors :

body.page-status .panel.panel-info .server .dot,
body.page-status .panel.panel-info .client .dot {
  font-size: 10px;
}

如果您使用的是 CSS 预处理器，例如 LESS ，你可以使用:

body.page-status .panel.panel-info {
  .server, .client {
    .dot {
      font-size: 10px;
    }
  }
}

关于css - 如何参数化CSS选择器？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/29502927/

相关文章：

javascript - 悬停后，文字似乎总是显示