css元素垂直居中的方法
    CSS 元素垂直居中的方法
    一、行内元素垂直居中
    1、使用line-height
    将元素的line-height设置为元素自身高度，这样文字就垂直居中了，代码如下：
    div {
    line-height: 20px; /* 元素高度 */
    height:20px; /* 元素高度 */
    }
    2、使用vertical-align
    可以将vertical-align属性设置为middle，这样元素就垂直居中了，代码如下：
    div {
    vertical-align: middle;
    }
    二、块级元素垂直居中
    1、使用margin
    将元素的margin设置成负值，需要同时设置top和bottom，使top负值等于bottom的负值，这样元素就垂直居中，代码如下：
    div {
    width:100px;
    height:20px;
    margin: -10px auto 0 auto;
    }
    2、使用position
    将元素的position设置为absolute，并且将top和left设置为50%，同时使用transform设置-50%的margin，代码如下：
    div {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
css设置文字垂直居中    width:100px;
    height:20px;
    }
    3、使用flex
    将元素的display设置为flex，并且设置align-items为center，这样元素就垂直居中了，代码如下：
    div {
    display: flex;
    align-items: center;
    width:100px;
    height:20px;
    }。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。