让指定div绝对位于页面（或某些元素）中间：
<html>
<head>
<meta charset="utf-8" />
<title></title>
<style type="text/css">
.element {
width: 200px;
height: 100px;
background: blue;
position: absolute;
left: 50%;
top: 50%;
transform:translate(-50%,-50%);/*关键代码*/
}
</style>
</head>
<body>
<!-- 方式一 -->
<!-- <div class="element"></div> -->
<!-- 方式二 -->
<!-- 需要移除<!DOCTYPE html> -->
<div style="height: 100%;display: flex;justify-content: center;align-items: center;">
<div style="width: 200px;height: 100px;background: blue;"></div>
</div>
</body>
</html>
附上效果图
缩放后的效果图：
