LogoClawIndex
案例技能关于
LogoClawIndex

ClawIndex

OpenClaw Skills 与 Use Case 索引

ClawIndex 是一个生态驱动的 OpenClaw Skills 与真实 Use Case 索引站。

索引

Skills·
Cases

Meta

关于·
声明·
邮箱·
GitHub
© 2026 ClawIndex 保留所有权利。

building-responsive-layouts - 使用移动优先CSS和容器查询创建响应式网页布局

使用移动优先CSS、流式排版和容器查询构建响应式网页布局

标签

更新于: 2026-03-09
网页开发响应式设计前端CSS移动优先

能力

典型输入

典型输出

该技能可以做什么

  • 创建网格布局
  • 实现断点
  • 应用流式排版
  • 使用容器查询
  • 处理触摸目标
  • 管理安全区域

输入

  • CSS代码
  • HTML标记
  • 视口尺寸
  • 设备能力

输出

  • 响应式CSS样式
  • 媒体查询规则
  • 容器查询实现
  • 触摸友好布局

要求

  • CSS支持
  • 现代浏览器
  • 设备测试工具

来源

  • 规范: SKILL.md
创建网格布局
实现断点
应用流式排版
使用容器查询
CSS代码
HTML标记
视口尺寸
响应式CSS样式
媒体查询规则
容器查询实现