极客观点
项目管理
HarmonyOS
测试图：
当图片缩小时，子层1就出离了背景层。
要怎样才能保证子层1一直在背景层的图片上？
html代码：
<body style="height: 100%">
<div class="fu" >
<!--父层-->
<div class="zi1">子层1</div>
<div class="zi2">
<img src="../public/images/test.png" style="width: 100%">
</div></div>
</body>
css层：
<style>
.fu {
background-color: #CCC;
width: 100%;
height: 50%;
border: 5px dotted #0F0;
margin: 0px;
padding: 0px;
}
.zi1 {
/*absolute
对自己的影响：相对于父层进行偏移，偏移的值是左50px，上50px
对其它层的影响：对同一个父层下的其它元素而言，该层是不存在的，所以其它层将重新排列。
*/
/*position: absolute;*/
/*relative
对自己的影响：相对于自己原来的位置进行偏移
对其它层的影响：虽然它自己相对于原来的位置进行了偏移，但对同层内的其它元素而言，它原来的位置好像还存在一样，仍然占据这位置，影响着其它层，是
使得其它层位置不变*/
position: absolute;
left: 45%;
top: 30%;
height: 50px;
width: 100px;
border: 3px dashed #96F;
background-color: #3F9;
margin: 0px;
padding: 0px;
}
.zi2 {
border: 3px solid #CC3;
background-color: #F60;
margin: 0px;
padding: 0px;
}
body {
background-color: #FF9;
margin: 0px;
padding: 0px;
}
</style>
相对父层进行绝对定位，那就要在.fu里加position:relative 的