圧縮されたCSSを読みやすく
2010-05-16


レイアウトを変えたときにローカルに置いている最適化(圧縮)されていないCSSファイルを壊してしまって以来、しかたないので最適化したCSSを直に操作するようになってしまいました。

たまに読みにくくて「;」を「;\n」(;毎に改行)に置換して見ていたのですが

WEB制作、プロの無料サービス活用術──コーディングに使えるツール(1) - MdN Design Interactive
[technique 06]圧縮されたCSSを読みやすく清書する
をちょっと試してみたら置換するより(当たり前だけど)いい感じ。

こんなのが↓
#head{background:url(img/2010/04/17/f7451.png) no-repeat left bottom;width:410px;height:128px;margin:0;padding:0 220px 0 290px}
#head h1{font-size:30px;margin-top:0;padding-top:16px}
#head h1 a{color:#353939;text-decoration:none}
#head h1 a:hover{color:#FFF;text-decoration:none;text-shadow:3px 3px 2px #000}
こんな感じに字下げまでしてくれます。
#head {
        background: url(img/2010/04/17/f7451.png) no-repeat left bottom;
        width: 410px;
        height: 128px;
        margin: 0;
        padding: 0 220px 0 290px }
 
        #head h1 {
                font-size: 30px;
                margin-top: 0;
                padding-top: 16px }
 
                #head h1 a { color:#353939;text-decoration: none }
 
                        #head h1 a:hover {
                                color: #FFF;
                                text-decoration: none;
                                text-shadow: 3px 3px 2px #000 }

ただこのソースに手を加えると、アップするときにはまた圧縮しないといけなくなるので(そのまま圧縮するとIE6で不具合があるので一手間必要で面倒なので)、修正は圧縮されているソースを直に操作することにしてます。

本当、IE6のおかげでいろいろ面倒だわ。


それと
[technique 05]難読化されたJavaScriptを読みやすくする
がGumblarの難読化解除に使えないかと思って試してみたのですが、読みやすくなったところで、難解なソースが分かりやすくなるわけではないことがよく分かりましたw


ストックしてる(書いてる途中とかの)ネタがなくなってしまった。困ったね。orz

[CSS]
[Gumblar]

コメント(全0件)
コメントをする


記事を書く
powered by ASAHIネット