flex布局常用属性

        主要用于设置元素居中，抽取css类备用

.flex {
    display: flex;
}
/*主轴设置为垂直方向*/
.flex-direction{
    flex-direction:column;
}

/*水平和垂直方向均居中*/
.flex-center{
    display: flex;
    justify-content: center;
    align-items: center;
}

/*交叉轴居中，主轴方向元素均匀分布*/
.flex-space{
    display: flex;
    justify-content: space-around;
    align-items: center;
}

.flex-between{
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/*元素自动换行*/
.flex-wrap{
    flex-wrap:wrap;
}
/*文本居中*/
.center {
    text-align: center;
}