1、絕對(duì)定位
#示例 1
.container{
height:100px;
position:relative;
background:red;
}
.inner{
height:50%;
width:50%;
background:blue;
position:absolute;
margin:auto;
left:0; right:0; bottom:0; top:0;
}
<div class="container">
<div class="inner">123</div>
</div>
示例截圖
2姜贡、使用vertical-align
是水平對(duì)齊方式棺棵，利用居中對(duì)齊middle實(shí)現(xiàn)
只有一個(gè)元素屬于inline或是inline-block（table-cell也可以理解為inline-block水平）水平，其身上的vertical-align屬性才會(huì)起作用爬橡。
#示例 2
th, td{
border:solid 1px gray;
height:100px;
vertical-align:middle;
}
示例截圖
3、line-height = height
當(dāng)只有一行的情況下宾添，設(shè)置行高等于高度，里面的文字就會(huì)垂直居中顯示缕陕。
#示例3
.container{
height:100px;
line-height:100px;
background:red;
}
<div class="container">
文字居中顯示
</div>
