0

私は 2 レベルのナビゲーションを行っており、3 番目のレベルを追加したいと考えています... CSS ドロップ ダウン ナビゲーション、3 番目のレベルの問題http://forums.asp.net/などの他の CSS コードを読んで参照しようとしているにもかかわらずt/1758667.aspx/1、まだコードを動作させることができませんでした。

現在のコードで第 3 レベルのナビゲーションを作成できるかどうかはわかりません。私は CSS ウィザードではありませんが、3 番目のレベルを作成する方法があるかどうかを確認したいと思います。

第 3 レベルのコンテンツを追加しましたが、それを表示するための CSS の作成に失敗しました。追加してみました:

   #menu li ul li ul { display:none;}
   #menu li ul li:hover > ul{display:block; position:absolute; left:150px;}

私にはcssですが、第3レベルは表示されませんでした

したがって、追加すると、3番目のレベルが表示されるかどうかを確認したかった

 #menu li ul ul { display:block;}
 #menu li ul li:hover > ul{display:block; position:absolute; left:150px;}

私の CSS には 3 番目のレベルが表示されましたが、結果が奇妙になることはわかっています。

私の現在のコードの JSfiddle は次のとおりです。http://jsfiddle.net/eqNZd/5/

助けてくれてありがとう...私の質問があなたを混乱させたらごめんなさい...

PS ナビゲーション バーを完成させたら、コードを整理します...コードが乱雑でしたら申し訳ありません。

4

1 に答える 1

0

ここから始めるのがよいでしょう。あなたのコードを見ましたが、かなり複雑に見えたので、私が書いた古いドロップダウンを修正しました。

JSFiddle ここ

これは非常に基本的な 3 層のドロップダウンです。

CSSドロップダウンを書くのに役立ったいくつかのヒントを次に示します。

  1. スタイルと機能性を切り離す
  2. 複雑にしないでおく
  3. サブメニューを 1 つ作成したら、無限の数のサブメニューを作成したことになります。あなたがする必要があるのは、他のすべてのサブメニューに対して同じ正確なコードulを繰り返すだけで、css.

ご覧のとおり、メニューが機能するには、ヘッダーに 1 つのセレクターul、各サブメニューulに 2 つのセレクターのみが必要です。これを変更して、必要なことは何でもできるはずです。

于 2012-10-15T04:40:13.250 に答える