私はこのHTMLファイルを使って、あるテキストを別のテキストにオーバーレイしたいのです。私はz-indexプロパティを使用しようとしましたが、動作させることはできません。私のコードには何がありませんか？CSSを使用してテキストを別のテキストにオーバーレイするにはどうすればいいですか？
おかげでたくさんここ
は
<html>
<head>
<style>
#overlay {
z-index:100;
}
</style>
</head>
<body>
<div id='overlay'>overlayed text</div>
This is some dummy text
</body>
</html>
position: absoluteを設定する必要があります。 z-indexは、静的に配置されていない要素に適用されます（BoltClockのコメントを参照）。
<html>
<head>
<style>
#overlay {
background-color: #EEEEEE;
position: absolute;
z-index:100;
}
</style>
</head>
<body>
<div id='overlay'>overlayed text</div>
This is some dummy text
</body>
</html>
z-indexだけposition:relativeまたはposition:absoluteを持つ要素に適用するコードです。あなたのケースでは、オーバーレイされたテキストを配置するためにposition:absoluteを使用したいと思うでしょう。
こんにちは前に、あなたのメッセージに感謝を。実際、絶対的なものは私がこの場合に必要なものです。よろしくお願いします。 – eric01
あなたはを利用することによってのみCSSでこれを行うことができます。
img.image:before {
left: 0;
content: "Coming Soon";
background: rgba(255, 255, 255, 0.59);
color: #000;
width: 100%;
height: 100%;
line-height: 2.5;
font-weight: 600;
position: absolute;
}
これは、静的に配置されていない要素に適用されます。つまり、「相対」、「絶対」、「固定」がすべて適用されます。 – BoltClock
あなたがそのように配置すると、Z-インデックスも必要ありません。 –
こんにちは、お返事ありがとうございます、それは私の問題を解決しました。よろしくお願いします。 – eric01