5

このDOMを想像してみてください。

<header>
    <h1> header </h1>
    <!-- other elements -->
    <nav>
        nav
    </nav>
</header>

<div>
    content
</div>

ヘッダーとナビゲーションの両方がとして配置されfixedます。コンテンツdivはとして配置されrelativeます。z-indexを使用して、この順序（上から下）でスタックを作成する必要があります。

  • ヘッダー*：not（nav）
  • コンテンツ
  • ナビゲーション

ナビゲーションを一番下（つまり、親の兄弟の下）に配置するのに苦労しています。私は、すべてのヘッダーの子がその兄弟の上または下に行かなければならないと思っています...これは正しいですか？もしそうなら、この状況の回避策はありますか？

4

2 に答える 2

5

またはなどの「配置」されたコンテンツのみが。を尊重しposition: absoluteます。HTMLは構造化されているため、親/子も尊重されるため、要求していることを実行できません。そのため、子は親に含まれている必要があります（z-indexと親を完全に異なるものにすることはできません）。 。あなたが望むことをするために、あなたはから抜け出す必要があります、そしてそれから彼らはそれぞれ独自の、コンテンツのデフォルトのゼロzインデックスの上と下に1つずつ持つことができます。position: fixedposition: relativez-indexnavheaderz-index

于 2013-01-20T21:53:34.687 に答える
0

DOMレイアウトでのこれに対する唯一の回避策は、負のz-index値を使用することです。ただし、負のマージン値を使用することはお勧めしません。負の値を使用することはお勧めしません。

より良い解決策は、DOMを再構築することです。これが便利な場合があります。z-indexプロパティの推奨される使用方法について説明します。

これがお役に立てば幸いです。

于 2013-01-20T21:55:23.110 に答える