不知道自己高度和父容器高度的情况下，用 CSS 实现元素垂直居中

1.知道父元素高度，不知道子元素高度

parentElement{
        position:relative;
    }
 childElement{
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
 }

2.Flex 布局：
不考虑兼容老式浏览器的话，用Flex布局简单直观一劳永逸：

 

parentElement{
    display:flex;/*Flex布局*/
    display: -webkit-flex; /* Safari */
    align-items:center;/*指定垂直居中*/
}

3.知道父元素高度，不知道子元素高度

.box{ width: 100%; height: 110px;display: table; }
.item{display: table-cell;vertical-align: middle;}