2

通常のz-indexの順序により、pここの要素は要素よりも高くなりh1ます。私の状況では、両方に背景があり、視覚効果として少しh1重なっています。p両方の要素は比較的配置されています。したがって、オーバーラップが発生すると、要素pの一部が非表示になります。それらを交換して絶対的に配置することなく、要素に要素よりも低いz-indexh1を与えるためのエレガントなソリューションはありますか？ph1

<h1>Title</h1>
<p>description</p>
4

4 に答える 4

4

z-indexを追加するだけです。正常に動作するはずです。実例。

サンプルCSS：

h1
{
    position: relative;
    top: 20px;
    left: 20px;
    color: blue;
    z-index: 50;
}
p
{
    position: relative;
    top: 0px;
    left: 0px;
    color: red;
    background-color: yellow;
}
​
于 2012-10-03T18:22:22.620 に答える
1

相対位置のアイテムにz-indexを使用できます。位置属性を定義する必要があります。ここを参照してください：https ：//developer.mozilla.org/en-US/docs/CSS/Understanding_z-index/Adding_z-index

于 2012-10-03T18:25:38.960 に答える
1

単純。H1に相対位置とz-indexを追加し、段落に負の上部マージンを追加するだけです。

例：http ：//dabblet.com/gist/3828786

于 2012-10-03T18:24:20.490 に答える
0

ヘッドセクションに以下を追加します。

<style type="text/css">
    h1
    {
        z-index:2;
    }
    p
    {
        z-index:2;
    }
</style>
于 2012-10-03T18:29:08.053 に答える