CSS セレクターを使用する Cleverly_Experience Exchange

さまざまなコンテンツ ブロックのリンク スタイルは、さまざまなルールを通じて定義できます。このようなもの: #nav a:link または #main a:link または #footer a:link異なるコンテンツ ブロック内の同じ要素に異なるスタイルを定義することもできます。たとえば、#main p と #sider p のスタイルをそれぞれ #main p と #sider p で定義します。構造的に言えば、ページは画像、リンク、リスト、段落などで構成されています。これらの要素自体は、どのネットワーク デバイス (PDA、携帯電話、インターネット TV) に表示されるかには影響しません。これらは、任意のパフォーマンスの外観として定義できます。

注意深く構造化された HTML ページは非常にシンプルで、すべての要素が構造的な目的で使用されます。段落をインデントしたい場合は、blockquote タグを使用する必要はありません。p タグを使用し、CSS text-indent ルールを p に追加するだけで、インデントの目的を達成できます。 p は構造化タグ、text-indent はプレゼンテーション属性であり、前者は HTML に属し、後者は CSS に属します。 (これは伝説的な構造とパフォーマンスの分離です)

適切に構造化された HTML ページには、パフォーマンス属性タグがほとんどありません。コードは非常にクリーンで簡潔です。たとえば、元のコード

は、プレゼンテーションを制御するすべてのものを HTML に と記述するだけで済みます。すべて CSS で記述されており、構造化 HTML では table はテーブルであり、他のものではありません (レイアウトや位置決めには使用できません)。

もちろん、CSS セレクターは単純なものではなく、id やクラスの他に、子孫セレクター、属性セレクターなどもあります。