css 文字上下居中对其 |css样式动画左右摆动

方法一：
{
display: flex; 
align-items: center;
justify-content: center;
}

使用flex布局，设置align-items为center，即可实现垂直居中。justify-content设置为center，即可实现水平居中。当然，前提是要有一个固定的容器。

方法二：
{
position: relative; 
}
span {
position: absolute;
top: 50%;
transform: translateY(-50%);
}

使用绝对定位将文字居中，当然，这里要有一个相对定位的父元素，采用这种方式能够不受容器大小的影响。将span的top设为50%即可使其向上上移一半高度，transform的translateY属性也要设为-50%，即可实现上下居中的效果。