直接看代碼就能理解了css
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style type="text/css"> .parent{ position: relative; height: 500px; width: 500px; background: seagreen;
} .son{ position: absolute; height: 100px; width: 100px; background: white; top: 50%; margin-top: -50px; left: 50%; margin-left: -50px;
}
</style>
</head>
<body>
<div class="parent">
<div class="son">son</div>
</div>
</body>
</html>
結果以下:html
PS:spa
top和left屬性是根據父組件的高度寬度移動子部件code
在top: 50%;和left: 50%;的基礎上,經過設置margin-top: -50px;和 margin-left: -50px;,就能使得子部件的軸線和parent軸線重合htm