嵌套选择器 - 可能吗？

Question

假设我有div里面有很多东西：

<div id="Product">
 <ul id="List"></ul>
 <div class="Component"></div>
 <input type=... />
 ...
</div>

现在，我希望设置各种内容，但仅限于#Product div内部。一般来说，我会这样做：

#Product #List {}
#Product .Component {}
#Product input {}

但是，我可以这样做吗？

#Product {
    #List {}
    .Component {}
    input {}
}

Answer 1

使用标准CSS无法嵌套CSS选择器，但还有其他工具，如SASS，LESS和XCSS，它们允许您按照描述的方式编写规则

这些工具通常“编译”成真正的CSS，处理将嵌套的选择器语法转换为真正的CSS规则。

Answer 2

是的，但不是普通的CSS。你可以使用Sass！ http://sass-lang.com/

Answer 3

不，你还不能在CSS中嵌套规则。有一些CSS预处理器可以使用嵌套，变量等很酷的功能。

查看LESS。