web-dev-qa-db-ja.com

重複したCSSルールをどのように識別できますか?

ここで使用済み/未使用の話はしていません。 2つのスタイルシートがあり、いくつかのルールが異なり(セレクター、ルール、またはその両方)、一部はまったく同じです。

そこで、両方のファイルで同じルールを抽出し、3番目のスタイルシートに移動する方法を探しています。

言い換えると、2つのスタイルシートの共通部分です。奇妙なことに、私はこのためのソフトウェアを見つけることができませんでした。これがより一般的な問題であると予想していたでしょう。

背景:気になる人のために:私はデスクトップWebサイトをモバイルWebサイトに変換しています。デスクトップスタイルシートを複製し、変更することから始めました(ものを捨て、追加します)。

3
DanMan

考えられる解決策の1つを次に示します。

  1. 両方のファイルをCSSコードフォーマットツールにコピーします。 http://www.codebeautifier.com/
  2. 各CSSルールセットが1行に収まるようにフォーマットします。 p { font-size: 13px }
  3. 結果を並べ替えプログラムに入れます。 Linux/Mac端末のsortコマンド。これもできるオンラインツールがあります。

これで、複製されたすべてのセレクターが隣り合うはずです。それらを手で簡単に組み合わせることができるはずです。

また、CSSルールの順序が異なると結果も異なることを忘れないでください。

2
DisgruntledGoat

差分ツールは機能しませんか? Beyond Compareを使用して、2つのファイル間に同一の行を表示します。コピーするだけです。

スクーターソフトウェアとは関係なく、単なるコンテンツユーザーです

0
pritaeas

Diffツールがあなたのためにそれをしていないなら、私は空のファイルから始めて、手動でそれを通過することをお勧めします。 CSSが数か月以上前のものである場合、その間に学習したすべての新しい内容が古くなっている可能性があります。 Geoffが言及したように、LESSまたは同様のものに行くことはそれを助けます。また、特にレスポンシブにならない場合は、デスクトップスタイルシートがモバイルスタイルシートの最適な出発点であるかどうかわかりません。多くの人が最初にモバイルと言います。

これが答えよりも意見のように聞こえる場合は、少なくとも私は正しいかもしれないという証拠として、それを行うソフトウェアを見つけることができなかったという事実を考えてみてください。 「正しい」という一般的な投票感覚

0
CodeMonkey

ツールを更新しました。これを使用して重複を削除し、レポートを表示して重複したルールとプロパティのリストを表示できます。

http://rbtech.github.io/css-purge

0
AEQ