CSS を使用して特定の見出しに続く段落のスタイルを設定するにはどうすればよいですか?

CSS を使用した次の要素の選択: 隣接兄弟セレクター

HTML を使用する場合、他の要素に続く特定の要素にスタイルを適用する必要があるシナリオに遭遇することがあります。 DOM ツリー内。 CSS では、これはプラス記号 ( ) で表される隣接兄弟セレクターを使用して実現できます。

この例では、clear: Both; を適用します。すべての

にルールを適用します。

の後に続くタグhc-reform クラスのタグ。これを行うには、正しい CSS セレクターは次のようになります。

h1.hc-reform + p {
  clear: both;
}

隣接する兄弟セレクターにより、両方がクリアされることが保証されます。ルールは

にのみ適用されます。

.hc-reform

の直後に続くタグヘッダ。このセレクターは Internet Explorer 6 以前ではサポートされていないことに注意することが重要です。

したがって、h1.hc-reform > で言及された問題に対処するために、 p セレクターが機能していませんでした。これは、そのセレクターが直接の子セレクターを表しており、

のみを選択するためです。

.hc-reform

の直接の子であるタグ。あなたの場合、

タグは直接の子ではなく、兄弟に続くものであるため、 h1.hc-reform p セレクターが正しい選択です。

以上がCSS を使用して特定の見出しに続く段落のスタイルを設定するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。