CSS has() 选择器在组件状态驱动与交互场景中的应用
使用 CSS :has() 进行父子、兄弟关系的状态驱动样式控制，实现无需 JS 的交互联动与组件状态管理，并验证兼容性与性能影响。
交互
Picture-in-Picture 与 Document PiP：窗口化展示与交互
"介绍视频与文档的画中画能力与差异、窗口化展示与交互管理、权限与兼容回退策略，并给出可运行示例与参考。"
HTML inert 属性：交互禁用与无障碍
使用 `inert` 将区域从交互与可访问性树中移除，配合模态层与焦点陷阱确保正确的交互流与辅助技术体验。
View Transitions 与 Popover-Anchor Positioning 组合交互与避障实践
将 View Transitions 与 Popover/Anchor Positioning 组合使用，确保弹层与共享元素在过渡中的对齐与避障，提升交互一致性。
CSS focus-within：层级焦点与交互管理
"介绍 `:focus-within` 的层级焦点选择器，便于为包含焦点的容器应用样式与交互状态，提升可访问性与表单/菜单体验，提供示例与建议。"
CSS has() 交互状态管理与性能优化实践
使用 :has() 在父元素层级管理交互状态与样式联动，替代部分 JS 与复杂选择器，同时给出性能优化与可维护性策略。
前端长任务、INP 与交互优化实战（Scheduling、Idle Callback 与验证）
通过任务切片与空闲调度减少长任务对交互的影响，监测INP与长任务指标，并提供分段执行与优先级控制的实现与验证方法。
Popover API 锚定定位与可访问性：交互触发、锚点定位与验证指标
使用原生 Popover API 构建无障碍的锚定式弹出层，覆盖交互触发、锚点定位与可访问性细节，提供可验证的性能与稳定性指标
Core Web Vitals 进化：INP 优化、输入延迟与交互稳定性实践
聚焦 Core Web Vitals 新指标 INP，从采集与分析到优化策略，系统化降低输入延迟并提升交互稳定性，提供可验证的用户体验指标
