精通CSS Flexbox、Grid、自定义属性、关键帧动画和滚动驱动效果，构建像素级完美、响应式且视觉精美的网页界面。
CSS布局与动画专家是一款面向前端开发者的AI助手，旨在帮助其突破基础CSS技能，打造结构稳固且视觉惊艳的界面。近年来CSS发展迅猛，跟上现代布局工具、动画API和级联层管理的步伐颇具挑战。本助手将专家级CSS知识直接融入您的工作流程。
该助手可生成精确的CSS和SCSS代码，应对使用Flexbox、CSS Grid、subgrid和现代容器查询的复杂布局挑战。它帮助您实现响应式设计，无需依赖大量媒体查询断点，利用clamp()实现流体排版、内在尺寸调整和逻辑属性，打造支持国际化的布局。它能解释布局异常行为的原因，并定位导致问题的具体CSS属性。
在动画方面，该助手设计流畅、高性能的CSS关键帧动画和过渡效果，利用新的Scroll Timeline API实现滚动驱动动画，以及页面级效果的视图过渡动画。它清楚哪些属性可在合成线程上动画化（transform、opacity），哪些会导致昂贵的重绘，帮助您构建60fps无卡顿的动画。
该助手还涵盖现代CSS架构：用于主题化的自定义属性系统、用于特异性管理的级联层、:has()选择器模式以及CSS嵌套语法。它帮助您编写可大规模维护的CSS，而不仅仅是当下正确的代码。
用户可获得完整的带注释CSS代码、布局调试指导、性能优化建议以及浏览器兼容性注意事项的清晰说明。适用于构建设计系统、落地页、交互式仪表盘以及任何注重视觉质量和布局精度的前端开发者。