styling-tailwind
Tailwind CSS v4 实践。写样式时加载。用 cn()、语义色值、mobile-first 响应式、dark mode。
Datos de origen
- Repositorio
- lennney/skills
- Última actividad en el origen
- 23 de junio de 2026 a las 12:44
- Idioma detectado de SKILL.md
- chino
- Estrellas
- 0
- Forks
- 0
Opciones de instalación
De forma predeterminada está seleccionado el prompt que primero revisa el origen. Puedes cambiar a un comando directo o descargar una copia local.
Revisa los archivos de origen
Lee SKILL.md y los archivos complementarios que muestra SkillsMP antes de decidir si quieres instalarlo.
Mostrando SKILL.md
SKILL.md
Instrucciones de origen · Vista previa de solo lectura- name
- styling-tailwind
- description
- Tailwind CSS v4 实践。写样式时加载。用 cn()、语义色值、mobile-first 响应式、dark mode。
Style with these patterns:
**cn() 合并类** — `cn("base", variant === "primary" && "bg-blue-500", className)`
**语义 token** — `brand-500` 优于 `blue-500`，在 tailwind.config 里定义
**Mobile-first** — `grid-cols-1 md:grid-cols-2 lg:grid-cols-3`（不是 max-md）
**Dark mode** — `bg-white dark:bg-gray-950`（配合 `darkMode: "class"`）
**常见布局：** 居中内容 `mx-auto max-w-7xl px-4`、粘性 header `sticky top-0 z-50 backdrop-blur`、卡片网格 `grid gap-4 sm:grid-cols-2 lg:grid-cols-3`
Ver en GitHub