4

これが私が期待するものの例です：

入力：

a {
    background: red;    
}

p {
    background: red;    
}

strong {
    background: red;
    color: green;
}

出力：

strong{color:green;}
a,p,strong{background:red;}

ほとんどのオプティマイザは次のような出力を行います:

strong{background:red;color:green;}
a,p{background:red;}

strongが含まれているにもかかわらずcolor: green;、 も含まれbackground: red;ているため、他のものとグループ化できるという事実をどのように取り上げていないことに注意してください。

あなたが提供できるどんな助けも大歓迎です

ではごきげんよう

イアン

4

2 に答える 2

2

ここでCSSTidyが役立つかもしれません。

この CSS の "before"を見ると、コードの次の部分が表示されます。

a:hover{
    color: #DD6900;
}

a.admin:hover,a.mod:hover{
    color: #DD6900;
}

CSS「after 」では、次のようになります。

a:hover,a.admin:hover,a.mod:hover,a.topictitle:hover {
color:#DD6900
}

考えられるすべてのケースに対処できるかどうかはわかりませんが、状況によっては、あなたが求めていることを行っているようです;-)

于 2010-02-25T07:32:07.367 に答える
0

さて、私が求めていたものは存在しないか、手に入れるのが非常に難しいようです。そのため、特定の問題を解決するスクリプトを書きました。誰かがいつか役に立つと思うかもしれないことを願って、ここに貼り付けています。

<?php

$css = file_get_contents('test.css');

//Strip comments and whitespace. Tabs to spaces
$css = preg_replace("/\s{2,}/e", ' ', $css);
$css = preg_replace("/\/\*.*?\*\//", '', $css);
$css = str_replace("\t", " ", $css);
$css = str_replace(": ", ":", $css);
$css = str_replace(" }", "}", $css);
$css = str_replace("{", "{", $css);
$css = str_replace(";}", "}", $css);

//Break each rule out onto a new line
$css = preg_replace("/}\s*/", "}\r\n", $css);

//Break @ rules out onto new lines
$css = preg_replace('/(@.*?;\s*)/', '\0'."\r\n", $css);


//Parse CSS Rules
$parsed = array();
$css = explode("\r\n", $css);
foreach($css as $line => $rule){
    if (preg_match('/(.*?)\{(.*?)\}/i', $rule, $regs)) {
        $clean_selectors =  preg_replace('/\s*,\s*/', ',', $regs[1]);
        $clean_selectors =  preg_replace('/,\s*$|\s$/', '', $clean_selectors);
        $parsed[$line]['selectors'] = explode(',', $clean_selectors);
        $parsed[$line]['properties'] = explode(';', $regs[2]);
    } elseif(trim($rule) != '') {
        $parsed[$line] = $rule;
    }   
}

//Group CSS by property
$groups =  array();
foreach($parsed as $line => $css){
    if(is_array($css)){
        foreach($css['properties'] as $pline => $property){
            if(isset($groups[$property])){
                $groups[$property] = array_merge($groups[$property], $css['selectors']);
            } else {
                $groups[$property] = $css['selectors'];
            }

        }
    } else {
        $groups[$line] = $css;  
    }
}

//Output CSS sorted by property
foreach($groups as $property => $selectors){
    if(is_array($selectors)){
        asort($selectors);
        echo implode(",\r\n", $selectors)." {\r\n\t".trim($property).";\r\n}\r\n\r\n";
    } else {
        echo $selectors."\r\n\r\n"; 
    }
}

?>

さて、いくつかの注意事項があります。

  1. いいえ、これは世界で最も美しいコードではありません。かつて私が抱えていた 1 つの特定の問題を解決するために迅速に作成されたものであり、使用するように与えられた CSS にかなり大きく調整されています。とは言っても、あなたが投げたほとんどのCSSで動作するのに十分なほど汎用的でなければなりません.

  2. CSS の性質上、ルールが表示される順序が最終的なドキュメントのレンダリングにとって重要になる場合があります。このスクリプトを使用してすべての CSS を実行すると、ページが期待どおりにレンダリングされなくなる可能性があります。このスクリプトを使用して、レイアウトを制御できない Web アプリケーションでページ固有の css をグループ化しています。各ルールは特定のページの特定の要素に適用されるため、このようにグループ化すると、大量の怪しげさを期待することはできません。CSS をより保守しやすくするだけです。

于 2010-02-26T01:38:10.580 に答える