/* 水平居中文本 */
.text-center {
text-align: center;
}
/* 水平居中块级元素 */
.block-center {
width: 50%;
margin: 0 auto;
}
/* 水平垂直居中元素 */
.center {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
/* 水平垂直居中元素（flex布局） */
.flex-center {
display: flex;
justify-content: center;
align-items: center;
}第一个方法是通过text-align属性实现文字水平居中。第二个方法是通过设置元素的宽度和左右margin为auto来实现块级元素水平居中。第三个方法是通过设置元素的position为absolute，然后通过top、left和transform属性来实现水平垂直居中。第四个方法是通过flex布局的justify-content和align-items属性来实现水平垂直居中。
以上几种方法都是实现元素居中的常用方法，根据不同的需求选择相应的方法即可。