CSSネスト変換｜フラットCSSとの相互変換
基本的なCSSルールをネスト形式とフラット形式の間で変換する補助ツールです。@keyframesは内容を保持して変換し、複雑なat-ruleやSass固有構文は確認が必要です。
このツールの使い方・詳細
🛠 使い方
CSSを入力し、ネスト化またはフラット化を選んで変換します。@keyframesと@-webkit-keyframesは内容を変更せず保持します。&参照、メディアクエリなどその他の複雑な構文はルールベース変換の対象外や誤変換になる場合があるため、結果をコピー後、CSSバリデータと対象ブラウザで必ず確認してください。
💡 活用シーン・ユースケース
- 単純なセレクタ群をCSSネスト記法へ整理する下書きを作る
- ネストした基本ルールをフラットなセレクタへ展開する