老师你好，想问关于移动量的问题
来源：4-3 编程练习
Liu1997
2019-08-03 18:22:18
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
*{padding: 0;margin: 0;}
.page{ width: 100%;height: 4000px;
background: url(http://climg.mukewang.com/59c9f7ce0001839219034033.png)
center top no-repeat;}
.banner1{width: 200px;height: 250px;
background: url(http://climg.mukewang.com/5a3383d00001a3dd02240364.png)no-repeat;
position: fixed; left:0;top: 50%; margin-top: -125px;}
.banner2{width: 200px;height: 250px;
background: url(http://climg.mukewang.com/5a3383c70001f1b702240364.png)no-repeat;
position: fixed;right:0;top: 50%;margin-top: -125px;}
</style>
</head>
<body>
<div class="page">
<div class="banner1"></div>
<div class="banner2"></div>
</div>
</body>
</html>
比如我设置
margin-top: -125px;这个值，那他这个-125px是根据哪里开始移动的？ 要是设置正的125pxz值又是怎么移动的呢，有点搞不懂是怎么移动的，是按照X轴Y轴的规则去移动的吗？
1回答
-
你好同学，不管是正值还是负值，都是在原位置的基础上进行移动。例如图片没有设置上间距的时候，
设置left:50%之后，是它的上边缘位置居中显示：
当设置margin-top: -125px;之后，会根据上边缘的位置往上移动：
祝学习愉快，望采纳。
0h019-08-04
相似问题