CSS_水平居中

<div class="parent">
	<div class="child">demo</div>
</div>

1. inline-block + text-align

使block元素变成inline元素，对里面inline元素进行居中

.child{
	display:inline-block;
}
.parent{
	text-align: center;
}

2. table+margin

.child{
	display: table;
	margin: 0 auto;
}

table在没有设置width: 100%;时，其宽度与demo大小相同
3. absolute + transform

.parent{
	position：relative;
}
.child{
	position: absolute;
	left: 50%;
	transform: translateX(50%);
}
left: 50%;使行child的左边在parent的中间
translate的百分比参照的是自己

4. flex + justify-content

.parent{
	display:flex;
	justify-content: center;
}

.parent{
	display:flex;
}
.child{
	margin: 0 auto;
}