1、直接设置最大div高度为100vh,设置背景图水平垂直居中
2、使用绝对定位 + translate 位移
案例:
<html>
<head>
<style>
* {
margin: 0;
padding: 0;
}
.divInfo {
min-height: 100vh;
background: url('111111.png') center no-repeat;
}
.centerbg {
background: red;
width: 50px;
height: 50px;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%,-50%);
}
</style>
</head>
<body>
<div class="centerbg">
方式2
</div>
<!-- 方式1 -->
<div class="divInfo">
</div>
</body>
</html>
网友评论