请老师检查
来源:4-3 编程练习
sunshine_mtt
2018-08-03 21:54:46
<!DOCTYPE html>
<html>
对于page的背景设置left top和center top no-repeat的使用场景麻烦解释一下
<head>
<meta charset="UTF-8">
<title></title>
<style>
.page{
width:100%;
height:2000px;
background:url("http://climg.mukewang.com/59c9f7ce0001839219034033.png") center top no-repeat;
}
.left{
width:200px;
height:300px;
left:0;
top:50%;
margin-top:-150px;
position:fixed;
background:url("http://climg.mukewang.com/5a3383c70001f1b702240364.png") no-repeat;
}
.right{
width:200px;
height:300px;
right:0;
top:50%;
margin-top:-150px;
position:fixed;
background:url("http://climg.mukewang.com/5a3383d00001a3dd02240364.png") no-repeat;
}
</style>
</head>
<body>
<div class="page"></div>
<div class="left"></div>
<div class="right"></div>
</body>
</html>
1回答
功能没问题。
center 和 top 是背景定位用,第一个值是水平位置,第二个值是垂直位置。
no-repeat 图片不重复叠加,直白一点就是用一张。
使用场景,banner 算一个吧。