Skip to main content

styling-tailwind

Tailwind CSS v4 实践。写样式时加载。用 cn()、语义色值、mobile-first 响应式、dark mode。

ソース情報

リポジトリ
lennney/skills
ソースの最終更新活動
2026年6月23日 12:44
検出された SKILL.md の言語
中国語
スター
0
フォーク
0

インストール方法

デフォルトでは、最初にソースを確認する Prompt が選択されています。直接コマンドに切り替えるか、ローカルコピーをダウンロードすることもできます。

ソースファイルを確認

インストールを決める前に、SKILL.md と SkillsMP に表示されている付属ファイルをお読みください。

SKILL.md を表示中

SKILL.md
ソースの指示 · 読み取り専用プレビュー
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`
GitHubで見る