📄️ 概览
面试一句话总结：CSS 基础面试中最常考的“三座大山”是：盒模型、选择器优先级 和 BFC（块级格式化上下文）。而在手写题中，Flex 居中和两栏/三栏布局则是必考项。
📄️ CSS 动画
前端实现动画主要有三种方案：JS 动画（如 requestAnimationFrame）、CSS3 过渡（transition）和 CSS3 关键帧动画（animation）。CSS 动画的面试核心是开启硬件加速 (GPU) 以避免主线程阻塞。
📄️ 移动端适配
面试一句话总结：移动端适配经历了几个时代：早期用媒体查询（响应式），后来淘宝的 flexible.js 开启了 rem 动态计算的时代；如今随着浏览器兼容性的提升，基于视口单位 (vw/vh) 的方案已经成为绝对的现代标准。 此外，1px 边框和刘海屏适配是必考的两个坑点。
📄️ CSS 工程化
随着前端复杂度的提升，原生 CSS 缺乏模块化、嵌套和变量等高级特性，容易导致样式冲突。CSS 工程化主要通过 预处理器（Sass/Less） 增强语法，后处理器（PostCSS） 兼容与优化代码，以及 CSS Modules / BEM / CSS-in-JS 来解决全局作用域污染问题。
📄️ 现代 CSS 与新特性
面试一句话总结：高级前端不仅要懂兼容，还要懂如何利用现代 CSS 特性简化代码和提升体验。CSS 变量是动态主题的核心，Grid 解决复杂二维布局，而 :has() 和 容器查询 正在彻底改变前端编写响应式组件的方式。
📄️ CSS 架构与性能优化
高级前端架构需要解决全局污染、多主题、渲染性能三大难题。目前原子化 CSS (Tailwind) 是主流趋势，性能优化重点在于打通关键渲染路径 (CRP) 并避免布局抖动。