3

ブラウザの互換性も確保する必要があります（IE8で動作するはずです）

私は出くわしました-：nth-​​last-child（2）
しかし、それはcss3セレクターであるため、ブラウザーと互換性がありません。

また、2番目、3番目、4番目の子を--td：first-child + td + tdとして取得するためのヒントに出くわしましたが、td：last-child--td
のように反転して最後から2番目の子を取得する方法はありません。

jqueryを使いたくありません。
最後から2番目の要素にクラスを適用することは唯一のオプションですか？

4

6 に答える 6

3

CSS3 nth-last-child は、サポートがますます一般的になるはずなので、おそらく進むべき道です。

これに失敗すると、マークアップの要素に CSS クラスを追加するだけで済みます。

<tr>
  <td>...</td>
  <td class = "penultimate">...</td>
  <td>...</td>
</tr>
于 2012-05-15T07:09:18.107 に答える
2

指定された条件下では、最後から 2 番目の要素にclass(またはid) を適用することが唯一のオプションです。

于 2012-05-15T07:15:12.087 に答える
1

nth-last-child 構文:

:nth-last-child(N) { } N は次のようになります。

number - 任意の整数 (1、2、10 など)。これは、親の下から数えて、その正確な位置で子と一致します。expression an+b の形式の代数式で、より複雑な組み合わせで一致させることができます。odd - 最後の子から始めて、1 つおきの子に一致します。even - 最後から 2 番目の子から始めて、1 つおきの子に一致します。

于 2013-10-03T16:39:10.623 に答える
1

テーブルで作業していることをほのめかすためだけに

最後から 2 番目のグループに対して何をしたいのか明確ではありませんが、例が table cells を参照しているという理由だけで、<col />スタイリングを使用してこの可能な解決策を提供します。

列の数を知る必要があります。ここに説明があります。設定できるスタイルには非常に厳しい制限があります (ただし、IE8 では機能します)。これはfiddle の例で、次の例があります。

HTML

<table>
    <col span="2"/>
    <col class="secondToLast"/>
    <tr><td>1</td><td>2</td><td>3</td><td>4</td></tr>
    <tr><td>1</td><td>2</td><td>3</td><td>4</td></tr>
</table>

CSS

.secondToLast {
    border: 1px solid blue;
    background-color: cyan;
    width: 100px;
}
于 2012-05-16T02:49:32.057 に答える
0

これを使用すると、 CSSで簡単になります。

:nth-last-child(2)
于 2016-04-01T11:11:32.297 に答える