5

UL/LI構造を使用してメニューシステムを作成しています。ホバー/ショーサブメニューに兄弟セレクターを使用しようとしています。

私はこれを使用しています。

#MainMenu li.Sel ul li.HasSub a:hover+ul {
     display: block;
}

UL構造は次のようになります。

<ul id='MainMenu'>
    <li class='Sel'>
    <a href='#'>Click Me</a>
        <ul>
            <li class='HasSub'>
                <a href='#'>Hover Over Me</a>
                <ul>
                    <li>Link</li>
                    <li>Link</li>
                </ul>
            </li>
        </ul>
    </li>
</ul>

おそらく、「Hover Over Me」にカーソルを合わせると、兄弟のulが表示されます。Firefoxではうまく機能しますが、IE8ではまったく機能しません。以前にIE8で使用されていた「+」兄弟セレクターを見たことがあると思いますが、どこが間違っているのでしょうか。

4

2 に答える 2

9

IEが標準モードで実行されていることを確認する必要があります-次のようなDoctypeを入力します。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
    "http://www.w3.org/TR/html4/loose.dtd">

ドキュメントから：

隣接する兄弟コンビネータは、2つの単純なセレクターを区切る「プラス記号」（+）文字です。空白は重要ではありません。

「E+F」形式のセレクターは、非要素ノード（テキストノードやコメントなど）を無視して、ドキュメントツリー内の兄弟要素Eの直後に続く場合に要素Fと一致します。要素EとFは同じ親を共有する必要があり、EはFの直前にある必要があります。親の最初の子と一致させるには、：first-child疑似クラスを使用します。

注 WindowsInternetExplorer7以降が必要です。
注 コンビネータは、標準準拠モード（厳密な！DOCTYPE）でのみ有効になります。

于 2009-10-23T10:33:32.850 に答える
0

li要素にホバーを追加し、ホバーを修正する方が簡単でしょうか。つまり、このhttp://www.xs4all.nl/~peterned/csshover.htmlを使用します。

すなわち

#MainMenu li.Sel ul li.HasSub:hover {
     display: block;
}

お役に立てば幸い

ジョシュ

于 2009-10-23T10:39:33.343 に答える