Depotから紹介します。System下記は各ポイントを意訳したものです。子要素のclassは親要素にはじめに数年前までウェブページの設計はテーブルがスタンダードでした。CSSはそれを大きく変え、今日ではCSSのフレームワークがウェブページの設計を容易にしてくれています。このCSSのフレームワークは余分なエレメントを数多く生成してしまうことがあります。複雑なレイアウトをもったページなどでフレームワークを使用することは、本当にテーブルから改善されているのでしょうか?無駄のない美しいコードを作成することは、フレームワークを単に使用するだけでなく、それが本当に何を表すのか考えることを意味します。これはdiv要素を無駄に多く使用するのを避けるだけでなく、classの乱用も避けることができます。System(960.gs)があります。これは文字通り、960pxをデフォルトの幅としたグリッドシステム用のフレームワークです。960.gsでの実装例をみてみます。ベースは12カラムで、3つのグリッドにしたものです。class="grid_4">...</div></div></textarea>ベースは16カラムで、2つのグリッドにしたものです。class="grid_4">...</div></div></textarea>上記のように、グリッドのサイズを変更することは、非常に簡単にできます。これはあくまでもサンプルでの利用例です。ここでdiv要素を使用しているのは、ウェブページのレイアウトにフレームワークを基盤としているのを分かりやすくするためです。classの乱用を避ける過度のCSSのコードに対する最も単純な解決方法は、必要でないことをやめることです。960.gsでは多くのレイアウトに対応するために180以上のclass定義を含んでいます。使用する際には、自分が使用するclassのみ残し、他のclassは削除するようにします。リスト要素の使用classを適用するのはdiv要素に限定されているわけではありません。さまざまな要素に適用が可能です。リスト要素をマルチカラムにレイアウトします。}</textarea>この実装例では、無駄なdiv要素を使用しないだけでなく、classの使用も最小限にしています。画像とキャプションの使用img要素の画像に隣接したp要素のキャプションです。見出しとパラグラフにそれぞれ同じスタイルを適用しています。}</textarea>子要素のclassは親要素に子要素に同じclassを使用する際は、親要素にclassを使用するようにします。}</textarea>親要素にclassを使用した方が、無駄のない美しいものとなっています。