速攻で整える!Tailwind CSS v4 セットアップ完全ガイド
CODE PREVIEW
エディタを読み込み中…
P
プロンプト
Tailwind CSS v4をプロジェクトにセットアップする完全ガイドを作成してください。新しい@tailwindディレクティブ、npm/CDN/CLIを使用したインストール方法、Viteでの設定などの主要な変更点を含めてください。簡単なレスポンシブな例も表示してください。
Tailwind CSS v4では、セットアップがよりシンプルになりました。@import "tailwindcss";という1行で従来の複数の@tailwindディレクティブを置き換えます。最新のアルファ版をnpmでインストール:npm install tailwindcss@next @tailwindcss/vite。他のバンドラーの場合は、Tailwind CLIまたは公式CDN(https://cdn.tailwindcss.com)を使用します。設定はCSSベースの@themeディレクティブで管理され、tailwind.config.jsは不要です。grid-cols-1 md:grid-cols-3のようなレスポンシブユーティリティですぐに構築を始められます。
このプロンプトは役に立ちましたか?
コメント
コメントは承認後に表示されます
この記事が役に立ったら投げ銭で応援
Apple Pay / Google Pay / カード (Visa/Mastercard/JCB/Amex) / Link / Alipay / WeChat Pay 対応 · Stripeで安全に決済
開発者が選ぶ最強ツール集
運営者が毎日使っているツール・ガジェット 6選