css居中总结

• 行内元素的水平居中：

 给父元素设置 text-align：center；但对浮动元素，绝对定位元素无效

• 确定宽度的块级元素的水平居中：

设置margin:0 auto;

• 不确定宽度的块级元素的水平居中

-将块级元素display设置为inline，然后使用text-align：center-给父元素设置float,position:relative,left:50%,子元素设置position:relative,left:-50%.

• 父元素高度不确定的行内元素块级元素的竖直居中

给父元素设置相同的上下边距

• 父元素高度确定的单行文本的竖直居中

line-height；对文本设置行高

• 父元素高度确定的多行文本，图片，块级元素的竖直居中

设置父元素display：table-cell  vertical-align：middle或直接使用表格

• 绝对定位元素的居中

left：50% margin-left:-width/2；（水平居中）left：50% margin-top:-width/2；（垂直居中）也可以用于fixed属性值的元素，但不能用于浮动元素