css布局 对齐

元素居中对齐：可以使用margin:auto;外边距设置 注意内边距padding设置无效。

注意这种必须设置width属性 设置为60%

文本居中对齐 可以使用text-align:center 

图片居中对齐，使用margin:auto,并且是块元素，所以设置display为block

img { display: block; margin: auto; width: 40%; }

垂直居中的对齐 可以使内部元素对齐。.center { padding: 70px 0; border: 3px solid green; }

。 一个简单的方式就是头部顶部使用 padding:

70px 0表示上下都间隔border70px；左右为0

设置line-height和height属性相同，也可以设置成居中。只适用于单行文字. line-height是指一个行的高度.

.center {
    line-height: 200px;
    height: 200px;
    border: 3px solid green;
    text-align: center;
}

.center p {
    line-height: 3;
    display: inline-block;
   vertical-align:middle;
}

也可以使用display:table-cell 将div元素转换成table-cell的元素,随后可以使用vertical-align:middle 使内部元素垂直居中,使用text-align:center 使内部元素水平居中.

https://www.cnblogs.com/chen-cong/p/8076442.html

https://www.cnblogs.com/jiangwenli/p/4924172.html

有关的居中方法还需进一步的总结。