1

<dd>CSSセレクターをスキップしてすべてに適用するにはどうすればよい<dt>ですか? 私はborder-bottom最初にのみ適用しようとしています<dt>.

私は試しました: dl > dt:not(:last-child)、しかしそれもうまくいきませんでした。

CSS:

dt:not(:last-child) {
    border-bottom: 5px solid #dddddd;
}

HTML:

<dl>
    <dt>Dates of Operation</dt>
    <dd style="display: none;"></dd>
    <dt>Dates of Operation</dt>
    <dd style="display: none;"></dd>
    <dt>Dates of Operation</dt>
    <dd style="display: none;"></dd>
</dl>
4

4 に答える 4

1

:first-of-typeCSS 疑似クラスを探しています:

dl > dt:first-of-type {
    border-bottom: 5px solid #dddddd;
}

ここでデモフィドルを参照してください。

いつものように、使用する前にターゲット ブラウザのサポートを確認してください。聴衆が多い場合、目的を達成するための標準的な方法は、通常のクラスを使用することです。

于 2013-10-01T01:25:27.850 に答える
0

どちらが特別な要素であるかによって異なります。最初のものだけが境界線を持つ場合は、使用する必要があります

dt:first-child{
        border-bottom: 5px solid #dddddd;
}

ただし、最後の子を除くすべての子に境界線を付けたい場合は、次のようにしてください。

dt {
    border-bottom: 5px solid #dddddd;
}

dt:last-child {
    border-bottom: none;
}

これは、dt 要素に追加された境界線の下のスタイルをオーバーライドします。

要素が 2 つしかない場合はid、 、classまたはを追加できますfirst-child。最後の子が特別な子である場合は、それに css を追加すると、他の多くのdt要素が含まれる可能性があります。

于 2013-10-01T01:20:50.607 に答える
0

最初の子を使用できます

最後の子とまったく同じように機能しますが、最初の子です。正常に動作するはずです。コードペンは次のとおりです。

http://codepen.io/anon/pen/eFkbq

于 2013-10-01T01:19:19.837 に答える