请问老师fixed那两个div怎么设置位置呢?没太看懂。。。

来源:4-3 编程练习

慕粉8021849

2019-05-22 22:07:31

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

<title></title>

<style>

.father{background:url(http://climg.mukewang.com/59c9f7ce0001839219034033.png) no-repeat ;

   height:4000px;

   width:100%;

   

}

.one{

   right:0;

   top:50%;

   margin:auto 0;

   

   position:fixed;

}

.two{

   left:0;

   top:50%

   margin:auto 0;

  

   position:fixed;

}

</style>

 

</head>

<body>

<div class="father">

   <div class="one"><img src="http://climg.mukewang.com/5a3383c70001f1b702240364.png"></div>

   <div class="two"><img src="http://climg.mukewang.com/5a3383d00001a3dd02240364.png"></div>

</div>

</body>

</html>


写回答

1回答

好帮手慕星星

2019-05-23

你好,首先需要给两个小盒子设置宽高,设置定位top为50%之后,是盒子顶部距离视口顶部50%,还需要向上移动自身高度一半,小盒子中心才能居中显示。参考修改:

http://img.mukewang.com/climg/5ce613320001b34a04610389.jpg

相同的样式可以合并,自己可以重新测试下。

祝学习愉快!欢迎采纳~

0

0 学习 · 40143 问题

查看课程