Web開発 入門 2 ステップ
CSS フォーマットと LESS 変換
CSS フォーマットによりコードが可読になる。LESS 変換により保守しやすいスタイルのための変数とミックスインが可能になる。
解決する問題
CSS をフォーマットし、プリプロセッサ使用のために LESS に変換する。
入力 → 出力
CSS フォーマッター 入力 → CSS から LESS への変換 出力 、計 2 ステップ。
実行時間
1–2分 · 完全にブラウザローカルで実行。
始める前に
- CSS 入力
パイプライン
-
Beautify or minify CSS online. Expand rules with indented properties or compress to a single line。無料、プライベート、100%クライアントサイド。
-
Css To Less — 純クライアントサイドツール。プライバシーファースト、サーバー往復なし。
▶このワークフローを実行
下に入力を入力し実行をクリック。すべての処理はブラウザのローカルで行われます — 何もアップロードされません。
パイプラインの進行状況
- CSS フォーマッターcss-format
- CSS から LESS への変換css-to-less
サンプル入力
a{color:red}b{color:blue} 期待される出力
a {
color: red;
}
b {
color: blue;
} この入出力ペアはビルド時に実際のツールで実行（tests/unit/recipes.test.ts）——期待出力は検証済み、例示ではありません。
こちらもおすすめ
このレシピとツールやテーマを共有するワークフロー。