2

以下を使用して、div内の最後のulの最後のリンク(a)をターゲットにします。だからこれが頭に浮かんだことです:

#menu ul:last-child li a {
       /*.....*/
}

その要素に手動でクラスを追加することはできません。動的に追加したい場合でも、上記の方法で要素をターゲットにする必要があります。

これが機能しない理由はありますか?

4

4 に答える 4

9

最後の ul最後のリンクが必要な場合(リンクが - 要素内にあると仮定)、これはあなたが望むものです:li

#menu ul:last-child li:last-child a {
       /*.....*/
}
  • #menuメニュー要素を返します。
  • ul:last-childul内の最後のものを返します#menu
  • li:last-childliその中の最後のものを返しますul

試したことはありませんが、これでうまくいくと思います。

于 2009-11-04T18:50:28.003 に答える
4

私はあなたのHTMLが何であるかを推測しているだけですが、

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css" >
    div ul:last-child li:last-child a:last-child {
        background-color: red;
    }
</style>
</head>
<body>
<div>
    <ul><li>First list</li></ul>
    <ul><li>Second list</li></ul>
    <ul>
        <li>Item 1</li>
        <li>
            <a href="#">First Link</a>
            <a href="#">Last Link</a>
        </li>
    </ul>
</div>
</body>
</html>
于 2009-11-04T16:33:31.440 に答える
0

CSSlast-child は、IE8 を含む IE では機能しません

他のすべての現在のブラウザーで動作するはずですが、IE をサポートする必要があるサイトで使用する予定がある場合は、それを行う別の方法を考え出す必要があります。

このページには、CSS セレクターの完全なリストと、それらをサポートするブラウザーがあります: http://quirksmode.org/css/contents.html

于 2010-11-03T23:51:42.737 に答える
0

コードを safari (4.0.3) と firefox (3.5.4) でテストしましたが、すべて正常に動作します。IE8 ではわかりません!

これは、CSS3 標準で定義された新しい疑似クラス (セレクター) であり、すべてのブラウザーで完全にサポートされているわけではなく、最も古いブラウザーではサポートされていないことを考慮してください!

原則として、パフォーマンス上の理由から、CSS ディレクティブは 2 つ以上のレベル (本当に必要な場合は最大 3 つ) を避けることをお勧めします!

ただし、スタイルをタグ付けされた要素に直接適用したくない場合は、javascript ソリューションを見つける必要があると思います!

于 2009-11-04T18:50:51.700 に答える