请老师检查4.3的编程练习
来源：4-2 侧边栏导航跟随案例
一只老仓鼠
2019-04-06 15:00:33
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
*{
margin:0;
padding:0
}
.page{
width:100%;
margin:0 auto;
position:relative;
}
.pageImg{
width:100%;
}
.left{
position:fixed;
left:0;
height:50%;
margin:auto 0;
top:0;
bottom:0;
}
.right{
position:fixed;
right:0;
height:50%;
margin:auto 0;
top:0;
bottom:0;
}
.left img{
height:300px;
width:200px;
}
.right img{
height:300px;
width:200px;
}
</style>
</head>
<body>
<div class="page"><img class="pageImg" src="http://climg.mukewang.com/59c9f7ce0001839219034033.png"/>
<div class="left"><img src="http://climg.mukewang.com/5a3383c70001f1b702240364.png"></div>
<div class="right"><img src="http://climg.mukewang.com/5a3383d00001a3dd02240364.png"></div>
</div>
</body>
</html>
1回答
-
你好，左右两侧没有实现垂直居中显示，如下：
是左右两侧盒子高度设置的不对，图片设置的高度是300px，那么父容器盒子也需要设置高度300px，而不是50%哦，参考修改：
自己可以重新测试下，祝学习愉快！
0
相似问题