Cssベストプラクティスジレンマ固有のケース

Question

クライアントは管理テーブルを要求し、1つの列はいくつかのルールに基づいてセルの色が異なります。

私の問題は、これは何のための最良のCSSの練習です。我々は各色ごとにいくつかのCSSクラスを行うと、彼らに良い名前を与えるが、これは単に、おそらく再び使用されることはありませんクラスと、メインのCSSファイルを乱雑になる可能性が開始

からインラインが悪いと知って

• 。

この単純な問題にはどのようなアプローチが適していますか？

Answer 1

この単純な問題にはどのようなアプローチが適していますか？

あなたは基本的に2つのオプションの概要を既に説明しました。それはあなたの選択です。

私はいつもクラスに参加し、インラインCSSでは決して行っていません。あなたが乱雑に心配している場合は、コメントを使用して、いくつかの順序を追加することができます。

/** Table highlight styles **/ 

table.data td.highlight { background-color: #CCCCCC } 
table.data td.total  { background-color: #ABCDEF } 

あなたは理論的には個別のCSSファイルにこれらを置くことができますが、スタイルシートの数はできるだけ少なくしなければなりません。このようにするには、@Ian ....のようにCSSプリプロセッサを使うことができますが、それはまったく違った新しいワームです。

Answer 2

個人的には、dotless（DotNet）またはless（Ruby）のようなものを個人的に使用することをおすすめします。

ここでは、@MyMainColourのような色を定義することができ、その後、あなたのCSSの圧縮を「コンパイル」と顧客の特定のテーマを有効にすることができますdiv.SomeBackground { background: @MyMainColour; }

これらのツールを持っています。

Answer 3

あなたは考えるかもしれません：

は、特定の調整のための個別のCSSファイルを保管してください。これは、メインスタイルのファイルを整理したままにすることと、調整しながら特定のGUIをターゲット設定できることとの間では良い妥協点かもしれません。

GUIにIDがあるとしましょう。このようにして、GUI固有の調整をコンテキストで与えられたスタイルでそのGUIにのみ影響させることができます。