HTML/CSS水平垂直居中方法（待补充）

一、已知盒子宽高

绝对定位 + 偏移值 + margin

让明确宽高的盒子水平垂直居中于窗口：

①position: absolute; 元素会变成块元素，脱离普通文档流

②top: 0; left: 0; bottom: 0; right: 0; 样式的块元素会让浏览器为它包裹一层新的盒子。因此这个元素会填满它相对父元素（body标签、设置了position: relative; 样式的容器）的内部空间。

③设置了宽高：浏览器会阻止元素填满所有的空间，根据margin: auto; 的要求，重新计算并包裹一层新的盒子。

即块元素是绝对定位，又脱离了普通文档流，浏览器在包裹盒子之前会给margin-top和margi-bottom设置一个相等的值——使用“完全居中”。

div {
	width:宽度px;//根据盒子具体宽度填写
    height:高度px;//根据盒子具体高度填写
	position:abosulte;
	right:0;
	left:0;
	top:0;
	bottom:0;
	margin:auto;
}

子绝父相 + margin

111

二、未知盒子宽高

子绝父相 + transform

111

flex

1111