html中元素水平居中的方法

一、行内元素
给行内元素的父元素设置text-align：center。
二、定宽元素
给元素本身设置margin：0 auto。
三、不定宽元素
1、将需要居中的元素转为行内元素或者行内块元素，再给元素的父元素设置text-align:center。
2、使用flexbox布局，将需要居中的元素的父元素设置display:flex及justify-content:center。
3、给需要居中的元素的父元素设置float:left、position:relative及left:50%，给需要居中的元素设置position:relative及left:-50%。
4、给父元素设置position: relative，给需要居中的元素设置position: absolute、 left: 50%及transform: translateX(-50%)。缺点在于元素的宽度是奇数时，50%是小数，边缘的文字或者边框会看不见。
5、将元素放进table的单元格中。

<table>
	<tr>
		<td>元素</td>
	</tr>
</table>