CSS不支持嵌套语法，所谓“嵌套选择器”实为层级选择器，包括后代、子、相邻兄弟和通用兄弟选择器，用于根据HTML结构匹配元素；而SASS的嵌套是编译时的语法糖，可生成对应CSS选择器，提升代码可读性与维护性，两者本质不同，纯CSS中无法使用类似SASS的嵌套写法。
CSS原生选择器本身不支持像SASS那样的嵌套语法，但可以通过层级选择器实现类似的效果。很多人将CSS的后代选择器、子选择器等称为“嵌套选择器”，其实这是一种误解——它们只是用来描述HTML结构中元素层级关系的选择方式，并非真正意义上的“嵌套写法”。
CSS中的层级选择器
CSS提供了多种方式来选择位于其他元素内部的元素，这些就是所谓的“层级选择器”。它们帮助开发者根据DOM结构精确地应用样式。
后代选择器（空格分隔）
：选择某个元素内部的所有指定后代元素。例如
div p
会选择所有在 div 内部的 p 元素，无论嵌套多深。
子选择器（>）
：仅选择直接子元素。例如
div > p
只会选中 div 的直接子级 p，不会影响更深层的后代。
相邻兄弟选择器（+）
：选择紧接在某元素后的兄弟元素。如
h1 + p
会选择紧跟在 h1 后面的第一个 p。
通用兄弟选择器（~）
：选择某元素之后的所有同级元素。比如
h1 ~ p
会选中 h1 之后所有同层级的 p 元素。
SASS中的真实嵌套语法
SASS是一种CSS预
处理器
，它允许使用真正的嵌套规则，让代码结构更清晰、更易维护。这种嵌套在编译后会被转换成标准的CSS选择器。
例如：
会被编译为：
使用HTML,CSS,JavaScript开发Android应用程序 英文文字pdf版附源文件
如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更
下载
立即学习
“
前端免费学习笔记（深入）
”；
可以看出，SASS的嵌套本质上是生成对应的后代选择器，简化了书写过程。
CSS与SASS嵌套的本质区别
关键在于：CSS没有嵌套规则的语法结构，而SASS有。SASS嵌套是为了提升开发效率和可读性，最终输出的仍是扁平的标准CSS。
CSS层级选择器是运行时的行为，依赖HTML结构。
SASS嵌套是编译时的语法糖，属于开发阶段的组织方式。
不能在纯CSS中写
div { span { color: red; } }
，这是无效语法。
基本上就这些。理解清楚这一点，就能避免混淆“CSS能嵌套”的常见误区。
nav {
ul {
margin: 0;
padding: 0;
list-style: none;
}
li {
display: inline-block;
}
a {
text-decoration: none;
}
}
nav ul {
margin: 0;
padding: 0;
list-style: none;
}
nav li {
display: inline-block;
}
nav a {
text-decoration: none;
}