HTML子选择器使用详解

CSS子选择器（>）是精准控制样式的利器，它只作用于父元素的**直接子元素**，严格限定在DOM树的第一层嵌套关系中，不穿透、不越级、不匹配伪元素或文本节点；许多样式失效并非语法错误，而是HTML实际结构（如框架自动插入的wrapper、空白文本节点）与预期不符所致——掌握它，关键不在记住符号，而在学会用开发者工具实时验证层级，让选择器真正“所见即所得”。

子选择器（>）只匹配直接子元素，不穿透嵌套层级

HTML 中的 > 是 CSS 子选择器，它严格限定「父元素 > 子元素」关系：目标元素必须是父元素的**第一层子节点**，不能是孙子、曾孙等更深层级。很多人误以为它类似后代选择器（空格），结果样式没生效，其实是结构没对上。

常见错误现象：ul > li 选不到

...