CSSを圧縮する、Clean CSS の使い方を調査した。

秋田書店工作員、週刊少年チャンピオン過激派、ラーメン二郎信者の感想日記

2011/01/13(木)
CSSを圧縮してくれる、Clean CSS
っと言うサービスについて調べてみました。

使い方は下記の通り。
エキサイト翻訳を使いつつ、変換しながら調査したので間違っているかもしれません。


Compression (code layout):プルダウンメニュー

Low (higher readability)
コメント行削除、属性のインデント、0pxを0などに、余分な空白削除、読みやすく空白を入れる。

Standard (balance between readability and size)
空白・改行を完全削除。
px表記を圧縮。"margin: 0px 0px 5px 0px;" を、"margin:0 0 5px;"などに変更
ほか?

High (moderate reability, smaller size)
要素ごとに中身の属性を一行に変換
ほか?

Highest (no readability, smallest size)
CSSの全ての中身を一行に変換
ほか?


Options

Sort Selectors (caution)
要素をABC順に並び替え

Sort Properties
属性をABC順に並べ替えます。

Optimise selectors and their properties
グルーピングレベル
1.何も変えない
2.不明???Only seperate selectors (split at ,)
3.グルーピングします(注意:100%安全ではありませんっと書いてあるw)

Merge shorthand properties
属性を短縮系に???
background-color: を background: などに変換?

Only safe optimisations
良くわからない!

Compress colors
colors属性を16進数から短縮系にします。
黒なら、
#000000
から
#000
に変更されます。

Compress font-weight
font-weight属性を、数値指定にします。
font-weight:bold;

font-weight:700;

Lowercase selectors
要素名を全て小文字にする。

Case for properties:
Lowercase:属性を全て小文字にする
Uppercase:属性を全て大文字にする

Remove unnecessary backslashes
不要なバックスラッシュを取り除く。

convert !important-hack
不明。

Remove last ;
最後の属性値の後ろにある、セミコロン;を取り除く。(省略する)

Save comments
コメントを削除しない。

Discard invalid properties
無効の特製を削除します。
例:-moz-border-radius 本プロパティはMozillaの独自拡張となりますので削除。

Output as file
何も起きない・・w

CSSを圧縮する、CSS Compressorの使い方を調査した。

HTML+CSSコーディング ベストプラクティス 高速かつ堅牢なコードを効率よく書くためにHTML+CSSコーディング ベストプラクティス 高速かつ堅牢なコードを効率よく書くために
(2010/08/25)
こもりまさあき、西畑一馬 他

商品詳細を見る
関連記事
この記事へのコメント
URL:
Comment:
Pass:
秘密: 管理者にだけ表示を許可する
 
この記事のトラックバックURL
http://cxu29eg.blog130.fc2.com/tb.php/287-868a7ead
この記事にトラックバックする(FC2ブログユーザー)
この記事へのトラックバック

 | Copyright © 原付で日本一周した人の感想日記2 All rights reserved. | 

 / Template by 無料ブログ テンプレート カスタマイズ