我有这个html文件,我想在其他文本上覆盖一些文本.我试图使用z-index属性但无法使其工作.我的代码中缺少什么?
非常感谢
这是代码
<html>
<head>
<style>
#overlay {
z-index:100;
}
</style>
</head>
<body>
<div id='overlay'>overlayed text</div>
This is some dummy text
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
Mar*_*era 11
你需要设置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>
Run Code Online (Sandbox Code Playgroud)
您可以通过使用 :before 单独使用 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;
}Run Code Online (Sandbox Code Playgroud)