2

ヘッダーリボンメニュー（ページ上部の水平メニュー）を作成しました。リンクにカーソルを合わせると、各リンクのサブメニューが開き、メインコンテンツの上に表示されます。

問題は、サブメニューがメインコンテンツの下に表示されることです。

サブメニューz-indexに高い値を設定しようとしましたが、役に立ちませんでした。

メインコンテンツz-indexを-1（0どちらも機能しない）に設定すると、サブメニューが表示されますが、コンテンツ内のすべてのボタンが機能しません。

z-indexCSS全体を検索しましたが、割り当てが1つもありません。

アップデート

コンテンツdivのスタイルは次のとおりです。

#content {
  background: #fff;
  position: absolute;
  top: 176px;
  bottom: 25px;
  padding: 20px 0px 63px;
  overflow: hidden;
}
4

3 に答える 3

3

メニューブロックと#contentブロックの両方が絶対的に配置されている場合は、両方に正のz-index値を設定して、オーバーラップできるようにする必要があります（メニューのz-indexはコンテンツよりも高くなります）。

CSS：

#content {
  background: #fff;
  position: absolute;
  z-index: 1;
  top: 176px;
  bottom: 25px;
  padding: 20px 0px 63px;
  overflow: hidden;
}

#menu {
  z-index:10;
}
于 2012-12-31T04:34:23.673 に答える
0

ホバー要素をどの位置に設定しましたか？z-indexは、配置された要素（position：absolute、position：relative、またはposition：fixed）でのみ機能します。

問題は、cssではなくHTMLにある可能性があります。たとえば、要素を閉じるのを忘れた場合、他の要素と重複する可能性があります。

いずれにせよ、質問にコードを追加すると非常に役立ちます。

于 2012-12-31T04:27:50.973 に答える
-1

考えられるエラー：

  1. MenuContainerDivのz-indexが負の場合があります。

  2. BodyまたはWrapperのz-indexの値が非常に大きい場合があります。

解決：

  1. すべてのz-indexを削除し、メニューのコードをコピーして、bodyタグまたはラッパーdivタグの最後に貼り付けます。z-index：99を追加することもできます。サブメニューに。

  2. BodyまたはWrapperからz-indexを削除し、メニューにz-indexを追加します。

于 2012-12-31T04:22:51.900 に答える