在CSS中定义"复合"样式

Question

是否可以定义CSS样式,使其默认包含另一个样式？

例如,参加以下课程:

.rounded{
  -webkit-border-radius:5px;
  -moz-border-radius:5px;
  border-radius:5px;
}
.box{
  height:200px;
  width:400px;
}

而不是<div class="rounded box">在网站上的任何地方写(这可能会导致较低的一致性,几乎肯定会导致html中的长串字符串),我可以定义.box自动包含.rounded？

这对CSS和CSS标签中的冗余有影响 - 我不必每次在新情况或上下文中找到一个元素时都可以指定border-radii,例如,可以合并.big_rounded,.med_rounded或者.small_rounded.

Answer 1

你可以这样做:

.box, .rounded {
  -webkit-border-radius:5px;
  -moz-border-radius:5px;
  border-radius:5px;
}

.box {
  height:200px;
  width:400px;
}