1.垂直居中
-父元素高度确定的单行文本:
设置父元素的 height 和 line-height 高度一致来实现的。(height: 该元素的高度;line-height: 行高(行间距),指在文本中行与行之间的 基线间的距离 )。
弊端:当文字内容的长度大于块的宽时,就有内容脱离了块。
-父元素高度确定的多行文本:
(1)插入 table(需要td)并且同时设置 td 的 vertical-align:middle,注:td 标签默认情况下 vertical-align 为 middle
(2)在 chrome、firefox 及 IE8 以上:设置display:table-cell(设置为表格单元显示),激活 vertical-align 属性,vertical-align:middle
2. position : absolute 或 float : left(right)
只要html代码中出现以上两句之一,元素的display显示类型就会自动变为以 display:inline-block的方式显示。