2

最近、Googleチュートリアルを使用して純粋なcssドロップダウンメニューを作成しました。

しかし、私には問題があります:

2番目のレベルに少しマージンを与えると、親とulの間のギャップにカーソルを合わせると、ドロップダウンが消えます。ulli

Javascriptを使わずにこれを修正する方法はありますか?

こちらのデモを参照してください:http://jsfiddle.net/ba76n/2/

4

4 に答える 4

2

padding-topの代わりに使用してくださいmargin-top

それが機能しているのを見てください。http://jsfiddle.net/ba76n/5/

于 2012-09-17T12:51:53.210 に答える
2

そのマージンにより、マウスは「マウスオーバー」状態をドロップしますが、それがないと正常に機能しません。

切り替えるとpadding-top:.5em;、期待どおりに機能するはずです。これは、余白がブロック要素の外側にあり、パディングが内側にあるためです。

于 2012-09-17T12:52:53.863 に答える
2

padding-topマージンがブロックの外側に適用されるため、代わりに使用margin-topします。サブメニューを選択しようとすると、マージンに表示され、ブロックが変更されてサブメニューが消えます。

于 2012-09-17T12:56:01.323 に答える
0

http://jsfiddle.net/ba76n/9/フィドルを更新しました...お役に立てば幸いです:)

(ドロップダウンliからマージントップを削除し、境界線を追加しました)

于 2012-09-17T12:54:15.783 に答える