欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

HTML 实现 div垂直水平居中

程序员文章站 2022-04-24 22:29:59
...
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
			*{
				margin: 0rem;
				padding: 0rem;
			}
			html,body{
				width: 100%;
				height: 100%;
			}
			.boss{
				width: 100%;
				height: 100%;
				background-image:  linear-gradient(to right,#485563,#29323c);
				display: flex;
				align-items: center;
				align-content: center;
			}
			.context{
				width: 37.5rem;
				height: 18.75rem;
				margin: 0 auto;
				background-color: #ffffff;
			}
		</style>
	</head>
	<body>
		<div class="boss">
			<div class="context">
				
			</div>
		</div>
	</body>
</html>

参考链接:https://www.cnblogs.com/yugege/p/5246652.html