我正在尝试使用CSS移动前景图像,因此它与背景图像重叠一点.我似乎无法让前景图像移动到任何地方,我只是无法弄清楚我做错了什么.谁能指出我正确的方向?看我的小提琴.
HTML:
CSS:
body{ background: black; } .background{ position: absolute; left: 0px; top: 0px; z-index: -1; } .frontImg{ position: absolute; left:200; top:500; z-index: 1; }
Sebastian Br.. 6
您缺少高度和宽度的单位(%,em,px等) .frontImg
body{
background:black;
}
.backgroundImg {
position:absolute;
left:0px;
top:0px;
z-index:-1;
-webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)));
}
.frontImg{
position:absolute;
left:200px;
top:100px;
z-index: 1;
}
另外,您可以进行一些优化:您可以将css从样式属性移动到css文件,以获得没有任何内联css的干净html结构.
我认为你的CSS上有一个拼写错误 - 取而代之的.background
是.backgroundImg
.
您缺少高度和宽度的单位(%,em,px等) .frontImg
body{
background:black;
}
.backgroundImg {
position:absolute;
left:0px;
top:0px;
z-index:-1;
-webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)));
}
.frontImg{
position:absolute;
left:200px;
top:100px;
z-index: 1;
}