233

ヘッダータグがある場合<h1 class="hc-reform">title</h1>

h1.hc-reform{
    float:left;
    font-size:30px;
    color:#0e73bb;
    font-weight:bold;
    margin:10px 0px;
}

その後、段落があり<p>stuff here</p>ます。

<p>次のすべてのタグを使用するように CSS を使用するにはどうすればよいですかh1.hc-reform。clear:both;

それは次のようになります:

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

何らかの理由で機能していません。

4

5 に答える 5

448

これは隣接兄弟セレクターと呼ばれ、プラス記号で表されます...

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

注: これは IE6 以前ではサポートされていません。

于 2010-09-07T15:24:40.547 に答える
74

兄弟セレクター を使用できます~：

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

これにより、最初の要素だけでなく、 の後に続くすべてのp要素が選択されます。.hc-reform

于 2010-09-07T15:30:55.110 に答える
16

no>は子セレクターです。

あなたが欲しいのは+

だから試してみてくださいh1.hc-reform + p

ブラウザのサポートは良くありません

于 2010-09-07T15:25:28.580 に答える
8

は子セレクター>です。したがって、HTML が次のようになっているとします。

<h1 class="hc-reform">
    title
    <p>stuff here</p>
</h1>

...それがあなたのチケットです。

しかし、HTML が次のようになっているとします。

<h1 class="hc-reform">
    title
</h1>
<p>stuff here</p>

次に、隣接するセレクターが必要です：

h1.hc-reform + p{
     clear:both;
}
于 2010-09-07T15:26:12.130 に答える
2

ではない正確に。は、 「正確に 1 レベル下のh1.hc-reform > p任意のレベル」を意味します。ph1.hc-reform

あなたが欲しいのはですh1.hc-reform + p。もちろん、古いバージョンの Internet Explorer では問題が発生する可能性があります。ページを古い IE と互換性を持たせたい場合は、手動で段落にクラスを追加するか、何らかの JavaScript を使用する必要があります (たとえば、jQuery では、次のようなことができます$('h1.hc-reform').next('p').addClass('first-paragraph'))。

詳細: http://www.w3.org/TR/CSS2/selector.htmlまたはhttp://css-tricks.com/child-and-sibling-selectors/

于 2010-09-07T15:32:15.107 に答える