CSS

1. 文字水平居中是 text-align: center

text-align: center;

2. 盒子水平居中 左右margin 改为 auto

2.1 必须是块级元素
2.2 盒子必须制定了width

.header {
     960px;
    margin: 0 auto;
}

3. 让定位position的盒子水平居中

原理和例子1看http://www.cnblogs.com/allen2333/p/9022252.html第8点

例子2. CSS3的tansform,也是基于上述原理

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style>
	div {
		position: absolute;
		 200px;
		height: 200px;
		background-color: pink;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		/*translate 如果x -50% 跟父亲没关系,是走自己盒子宽度的一半*/
		/*translate 如果y -50% 跟父亲没关系,是走自己盒子高度的一半*/
	}
	</style>
</head>
<body>
	<div></div>
</body>
</html>
原文地址:https://www.cnblogs.com/allen2333/p/9011651.html