1. コメントについて
xhtml+CSS の Web サイトを作成する場合、CSS のコメントは非常に重要です。 CSS スタイルを作成するときは、気軽にコメントする習慣を維持する必要があります。 EditPlusなどのハイライト機能のあるエディタではC言語でよく使われる「/********」が使われるため、一般的に「/* コメント内容*/」の形式でコメントを書くことに慣れています。 *******/」などのコメントは無意味であり、区切りとして意味のない内容を大量に記入する必要はありません。コメントを含むドキュメントは、Web サイトの元の CSS ドキュメントとして機能します。Web サイトを公開するときに、CSS 圧縮ツールを使用して CSS を圧縮し、出力 CSS からコメントを削除して、ファイル転送効率を向上させることができます。
2.ネーミングについて
CSS ファイルに名前を付けるときは、意味的に正しい英語名または略語を使用することを好みますが、珍しい部分には部分的なピンイン名を使用する場合があります。さらに、一部の依存クラスでは、「list_banner」のような名前、つまり親要素名に「_」と要素名を加えた名前を使用する場合があります。
命名に関しては、チームデザイナーの習慣に基づいて交渉できます。ただし、将来の参照用にドキュメントを生成できるように、名前の後にコメントを追加することをお勧めします。
3. 継承について
CSS では、継承をうまく活用します。たとえば、2 つのネストされた div では、親要素が背景色属性を黒として定義し、子要素の背景も黒である場合、定義を繰り返す必要はありません。 CSS 継承をうまく利用すると、コードをより効率的かつ合理化できます。
4. CSS定義のレベルについて
CSS でクラスを定義する場合は、階層的な方法を使用してステートメントを記述することをお勧めします。
構造例:
| 引用した内容は以下の通りです。 <div id="メニュー"> <div class="メニューリスト"> <div class="selectit"></div> </div> </div> |
CSS の例:
| 引用した内容は以下の通りです。 #メニュー { ... } #メニュー .menulist { ... } #menu .menulist .selectit { ... } |
上記の例では、最終的な効果から、#menu を繰り返し表示する必要はありませんが、実際には、#menu を先頭に追加できたほうが、ドキュメントの階層が明確になり、読みやすくなります。
5. スタイルソートについて
CSS スタイル シートを設計するときは、ほとんどの場合コードを手作業で記述するため、クラス内のスタイルの順序が混乱しやすくなります。たとえば、いくつかのクラスはパディング、マージン、背景、色、その他のスタイルを使用しますが、並べ替えの際、背景を高くするクラスもあれば、マージンを高くするクラスもあります。これにより、ある程度の混乱が生じ、簡単に思考が挫折してしまう可能性があります。個人またはチームのデザイナーが大まかな順序に同意することをお勧めします。これにより、個別には大きな違いはありませんが、全体的には読みやすく管理しやすくなり、全体の効率が大幅に向上します。
たとえば、デフォルトでは、幅、高さ、パディング、マージン、境界線などを前面に配置し、その後に背景、次にテキストを制御するフォント、色、テキスト配置などを配置し、その後にいくつかの特別なタグを配置します。 list-style などの要素、そして最後に CSS フィルターのみが使用されます。特殊な状況（定義する必要がある特定の CSS プロパティの優先順位など）が発生した場合でも、柔軟に処理できます。