CSSミニファイアは何をしますか？
Cascading Style Sheets（CSS）のコードを圧縮します。
ブラウザーツール
CSSミニファイア
CSS Minifyでコードを処理し、変換した出力を確認します。コードを入力し、処理オプションを選んで結果をコピーします。
ツールの作業領域
入力が必要入力はこのブラウザー内にとどまります。
続行するには必要な入力を追加してください。
結果はここに表示されます
続行するには必要な入力を完了してください。
直接回答
CSSミニファイアの機能
CSSミニファイアはスタイルシートの空白を減らします。たとえばh1 { color: red; }はh1 {color: red;}になります。CSSを実行せず、ブラウザーでの見た目も確認しません。
結果
得られるもの
CSSテキストを返します。HTMLプレビューとブラウザー互換性レポートは含みません。
このツールを使う
CSSミニファイアの使い方
- 入力にh1 { color: red; }を貼り付けます。
- この例ではPreserve commentsを無効にします。コメントを保持する場合は有効にします。
- ツールを実行し、結果をh1 {color: red;}と比較します。対象ページでスタイルシートを試します。
例
安全なサンプルで試す
入力: 操作がコードを受け付ける場合のconst value = 1;のような開発用テキスト
設定: 設定済みの操作を選びます。CSSミニファイアを実行する前に、実行モードがdebouncedで、結果出力がcodeであることを確認します。
結果: ワークスペースはブラウザーでコード結果を生成します。
この例はCSSミニファイアの入力形式を示します。正確な結果は操作、値、設定によって異なります。
一般的な用途
CSSミニファイアが役立つ場面
- 小さなCSSサンプルを共有する前に空白を減らします。
- 空白を減らす前後のスタイルシートを比較します。
- コンパクトなテキストを必要とするシステム用にCSSを準備します。
制限
結果を確認
- セレクター、プロパティ、ブラウザー互換性を検証しません。
- 出力に一部の空白が残る場合があります。完全なビルド最適化ツールではありません。
- 必要なライセンスコメントと元のスタイルシートを保持します。置き換える前に表示を試します。