居中方式以及左右对齐

1.垂直居中：

设置父元素：

body {
     display: flex;
     align-items: center; /*定义body的元素垂直居中*/
     justify-content: center; /*定义body的里的元素水平居中*/
  }

子元素即可垂直和水平居中

2.水平居中：

除了上面说的方法，还有text-align: center;

3.右对齐（浮动到最右）：

设置父元素：

body {
	display: flex;
}

子元素：

div {
	 margin-left : auto; 
}

4.右对齐同理

5.还有一种垂直水平居中的方法就是transform：

css文件：

.word  {
position: absolute;
top: 50%;//
left: 50%;
transform: translate(-50%,-50%);//这句话起到关键作用

}

html:

<span class="word" >1月10日</span>

然后这个span就能水平垂直居中

来源：CSDN

作者：水仙根加艾草液

链接：https://blog.csdn.net/guanqihui/article/details/104685033