居中大杂烩

弹性盒居中

	display: flex;
	justify-content: center; /*垂直居中*/
	align-items: center; //水平居中

盒子内的图片居中显示

<div class="box">
	 <img
          class="image"  
          src="@/assets/img/9.png"
          alt
        />
</div>

.box {
    width: 60px;
    height: 60px;
    line-height: 60px;
    text-align: center; //水平居中
    .image {
      width: 19px;
      height: 16px;
      vertical-align: middle; //垂直居中
    }
  }

P标签多行文字居中

.key {
  height: 44px;
  white-space:normal;// 多行换行
  line-height: 20px;
  padding-top: 8px;
  padding-left: 11px;
  padding-right: 10px; 
}
//根据需求更改height,line-height,padding-top的值

效果展示：