怎么样才能做到自适应
来源:7-2 编程练习
刘一
2019-12-08 14:29:44
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
*{
margin: 0;
padding:0;
}
.test{
width: 15%;
height: 100px;
background:url(http://climg.mukewang.com/5a3383c70001f1b702240364.png);
background-size: 100% 100%;
position: fixed; /*此处写代码*/
left: 0;
top:200px;
}
.test1{
width: 15%;
height: 100px;
background:url(http://climg.mukewang.com/5a3383c70001f1b702240364.png);
background-size: 100% 100%;
position: fixed; /*此处写代码*/
right: 0;
top:200px;
}
.out{
width:100%;
height: 2000px;
background:url(http://climg.mukewang.com/59c9f7ce0001839219034033.png);
background-size: 100% 100%;
}
</style>
</head>
<body>
<div class="out">
<div class="test">
</div>
<div class="test1">
</div>
</div>
</body>
</html>
1回答
好帮手慕小尤
2019-12-08
同学你好,使用固定定位,将左右块元素相对于窗口垂直居中,实现自适应。修改后代码如下:

祝学习愉快!
相似问题