master

分支 (2)

管理

管理

master

dev_test

web-test
/
div中元素水平居中和垂直居中总结.html

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<style>
		span{
			color: white;
		}
		.box1{
			width: 100%;
			background: #0000FF;
			text-align: center;
		}
		.box2{
			width: 400px;
			background: #004756;
			text-align: center;
		}
		.box3{
			width: 500px;
			background: #008000;
			margin: 0 auto;
		}
		.box4{
			width: 200px;
			height: 50px;
			position: absolute;
			background:#00FFFF;
			left: 50%;
			margin-left: -100px;
		}
	</style>
	<body>
		<div class="box1"><span>我在水平居中1</span></div>
		<div class="box2"><span>我在水平居中2</span></div>
		<div class="box3"><span>我在水平居中3</span></div>
		<div class="box4"><span>我在水平居中4</span></div>
	</body>
</html>