Frontend Responsive - 构建适用于所有屏幕尺寸的响应式布局

该技能可以做什么

• 构建响应式布局
• 一致地使用标准断点
• 使用百分比宽度实现流体布局
• 使用rem/em单位代替像素
• 确保触摸友好的点击目标
• 为移动设备优化图片
• 在较小屏幕上优先考虑内容可见性

输入

• 布局组件
• 网格系统
• 导航元素
• 屏幕尺寸
• 断点

输出

• 响应式布局
• 适配的导航
• 重排的网格布局
• 缩放的字体大小
• 触摸友好的点击目标
• 优化的图片

要求

来源

• 规范: SKILL.md