2-9的问题,怎么让背景图片 覆盖到别的图片上面
这个作业我都做晕了。。。麻烦帮忙看下
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Career Builder</title>
<style type="text/css">
.gallery .g-top .g-img,.g-zushi1{
width: 25%;
float: left;
}
.gallery .g-top2 .g-img2,.g-zushi2{
width: 25%;
float: left;
}
.gallery .g-top .g-zushi1{
height: 396px;
background: url(images/background.png);
color: #fff;
}
.gallery .g-top2 .g-zushi2{
height: 396px;
background: url(images/background2.png) ;
color: #fff;
}
h2{
margin-top:20px;
margin-left: 50px;
margin-bottom: 15px;
}
.gw1{
width: 80%;
margin-left: 50px;
font-size: 14px;
line-height: 1.8em;
margin-bottom: 15px;
}
.gw2{
width: 80%;
margin-left: 50px;
font-size: 12px;
line-height: 1.8em;
color: #D8D8D8;
}
.bt3{
font-size: 16px;
width: 100px;
height: 50px;
background-color: #000;
color: #fff;
margin-top:50px;
border: 1px solid #000;
margin-left: 40%;
}
.bt3:hover{
cursor: pointer;
border: 1px solid #000;
background-color: #fff;
color: #000;
}
</style>
</head>
<body>
<div class="header">
</div>
<div class="banner">
</div>
<div class="about">
</div>
<div class="gallery">
<div class="g-top">
<div class="g-img">
<img src="images/b1.jpg">
</div>
<div class="g-zushi1">
<h2>Library</h2>
<div class="gw1">Lorem Ipsum is simply dummy text of the printing and typesetting industry.</div>
<div class="gw2">Lorem Ipsum has been the industry dummy text ever since the 1500s,when an unknown printer took a galley of type and scrambled it to make a type specimen book.</div>
<button class="bt3">EXOLORE</button>
</div>
<div class="g-img">
<img src="images/b2.jpg">
</div>
<div class="g-zushi1">
<h2>Library</h2>
<div class="gw1">Lorem Ipsum is simply dummy text of the printing and typesetting industry.</div>
<div class="gw2">Lorem Ipsum has been the industry dummy text ever since the 1500s,when an unknown printer took a galley of type and scrambled it to make a type specimen book.</div>
<button class="bt3">EXOLORE</button>
</div>
</div>
<div class="g-top2">
<div class="g-zushi2">
<h2>Library</h2>
<div class="gw1">Lorem Ipsum is simply dummy text of the printing and typesetting industry.</div>
<div class="gw2">Lorem Ipsum has been the industry dummy text ever since the 1500s,when an unknown printer took a galley of type and scrambled it to make a type specimen book.</div>
<button class="bt3">EXOLORE</button>
</div>
<div class="g-img2">
<img src="images/b4.jpg">
</div>
<div class="g-zushi2">
<h2>Library</h2>
<div class="gw1">Lorem Ipsum is simply dummy text of the printing and typesetting industry.</div>
<div class="gw2">Lorem Ipsum has been the industry dummy text ever since the 1500s,when an unknown printer took a galley of type and scrambled it to make a type specimen book.</div>
<button class="bt3">EXOLORE</button>
</div>
<div class="g-img2">
<img src="images/b4.jpg">
</div>
</div>
</div>
<div class="footer"></div>
</body>
</html>
正在回答 回答被采纳积分+1
- 参与学习 人
- 提交作业 11218 份
- 解答问题 36713 个
从一个不会编程的小白到一个老司机是需要过程的,首先得入门,学习基础知识,然后才能进阶,最后再到精通,本专题是你走进前端世界的不二选择!
了解课程
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星