VUE前端开发Tips---002

VUE前端开发Tips---002

在一个块状div中，使多行文字垂直居中

<div class="tableCell_parents">
     <div class="tableCell_box">
        <div>第一行</div>
        <div>第二行</div>
     </div>
</div>

.tableCell_parents {
    width: 100%;
    height: 2rem;
    display: table;
    background-color: yellow;
}
.tableCell_box {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}

父亲必须有高度，display：table-cell需要将所有需要垂直居中的div包裹起来

vertical-align 和text-align 两个属性是和display：table-cell 配合使用的