#Baseline

现代 CSS 完整实战 2026：容器查询、:has()、锚点定位与滚动驱动动画

过去十年前端的复杂交互几乎都要用 JavaScript 实现：监听 resize 改布局、DOM 向上查找决定父级样式、滚动时用 rAF 改 transform、弹层定位用 Popper 计算。2026 年这些脚本大面积退场，CSS 自己长出了容器感知、父选择器、锚点定位和滚动时间轴。本文完整实战现代 CSS：容器查询与容器单位、:has() 选择器、嵌套语法、anchor-positioning 弹层、scroll-driven animations、text-wrap 排版、View Transitions 过渡、级联层，以及 Baseline 渐进增强策略。