1.css3视口单位:vw,vh,vmin,vmax
【视口:视口,就是根据你浏览器窗口的大小的单位,不受显示器分辨率的影响,是不是很神奇,这就代表了,我们不需要顾虑到现在那么多不同电脑有关分辨率的自适应问题】
vw:这是“视口宽度”单位。 1vw等于视口宽度的1%。它与百分比类似,不同之处在于,所有元素的值都保持一致,无论其父元素或父元素宽度如何
vh:这与vw(视口宽度)单位相同,只是它基于视口高度。
vmin:当前 vw 和 vh 中较小的一个值
vmax:当前 vw 和 vh 中较大的一个值
水平居中对齐
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
.parent{
width:50vw;
height:50vh;
margin: 25vh auto;
background-color: #ff0ff0;
}
</style>
</head>
<body>
<div class="parent">
</div>
</body>
</html>