負のマージン値によって引き起こされる階層 (z-index) の問題

この記事では主に、負のマージンによって引き起こされる階層 (z-index) 問題の解決策を紹介します。必要な友人はそれを参照してください。 まずこのコードを見てみましょう:

コードをコピーします

コードは次のとおりです:

スクリプト ホーム

IE6 と IE7 では、図に示すように、内側のコンテナーは外側のレイヤーで覆われます:

IE8 と ff では、図に示すように、外側のコンテナーは内側のレイヤーで覆われます:

本当にクレイジーです、IE8 に到達したい場合、外側のコンテナが内側の層で覆われていることの影響は、IE7 では内側の層のレイアウトをトリガーすることで解決できますが、IE6 ではこの問題を解決するには、position:relative を使用する必要があります。もちろん、position:relative 自体がレイアウトをトリガーできるため、position:relative も ie7 の問題を解決します。

コードを見てください: 代 コードをコピーします: 次のようなコード:

& lt; p style = "height: 100px; width: 200px; border: plain 1px black;" & gt;

& lt; ;p style="background-color:Red;margin-top: -5px;position:relative" mce_style="background-color:Red;margin-top: -5px;position:relative"> ;
スクリプトホーム

p>



もちろん、IE8 と FF で IE6 と IE7 の効果を実現したい場合は、外側の層に overflow: hidden を追加するだけです。コードを参照してください

コード

コードは次のとおりです:

p style="background- color:Red;margin-top: -5px;" mce_style="background-color :Red;margin-top: -5px;">

スクリプト ホーム /p>

以上が負のマージン値によって引き起こされる階層 (z-index) の問題の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。