请老师检查一下代码,谢谢
来源:1-1 课程简介
慕雪5427064
2021-06-04 16:28:20
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
*{
margin: 0;
padding: 0%;
}
.back img{
width: 100%;
height:100%;
position: relative;
}
.p1{
width: 224px;
height: 364px;
display: block;
position: fixed;
top: 50%;
right: 0px;
margin-top: -182px
}
.p2{
width: 224px;
height: 364px;
display: block;
position: fixed;
top: 50%;
left: 0px;
margin-top: -182px
}
</style>
</head>
<body>
<div class="back">
<img src="http://climg.mukewang.com/59c9f7ce0001839219034033.png" alt="">
</div>
<div class="p1">
<img src="http://climg.mukewang.com/5a3383c70001f1b702240364.png" alt="">
</div>
<div class="p2">
<img src="http://climg.mukewang.com/5a3383d00001a3dd02240364.png" alt="">
</div>
</body>
</html>
1回答
同学你好,效果实现是的,建议优化:可以将样式相同的代码使用组合选择器书写在一起,简化代码,另外,设置了固定定位的元素默认表现为块元素,可以不用设置display:block;属性了,如下:
祝学习愉快~
相似问题