比如 top、left、transform屬性的translate方法,他們的百分比都是相較誰而言的?
top、left是基於父元素的:

.parent {
position: relative;
background-color: rgb(243, 225, 225);
height: 100px;
width: 240px;
}
.child {
text-align: center;
width: 100px;
background-color: cornflowerblue;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
translate的參數:left(x 坐標) 和 top(y 坐標) 位置參數 ,
如果是百分比,會以本身的長寬做參考
top:0; left:0 的時候:

把left設置成 50% 的時候,div.child的左、上距離就是div.parent的寬度的一半;

