CSS样式规则声明

Question

我不记得我在哪里看到它或它声称的语言变化但是我看到了一种在另一种声明中有声明的样式规则。它类似于下面的内容。

nav ul {
    list-style-type: none;
    li {
        color: #fff;
    }
}

我很确定它看起来像那样，如果我猜对了，就会这样：

nav ul {
    list-style-type: none;
}
nav ul > li {
    color: #fff;
}

有人可以告诉我这是什么CSS的变化，所以我可以了解更多，因为它似乎更简单。

Answer 1

现在这是大多数CSS预处理器..它叫做nested rules。

lesscss.org

SASS css

来自lesscss网站的一个例子：

  

Less使您能够使用嵌套代替级联或与级联结合使用。假设我们有以下CSS：

#header {
  color: black;
}
#header .navigation {
  font-size: 12px;
}
#header .logo {
  width: 300px;
}

  

在Less中，我们也可以这样写：

#header {
  color: black;
  .navigation {
    font-size: 12px;
  }
  .logo {
    width: 300px;
  }
}