1、margin : auto
此属性用于将块元素水平对齐到中心。
示例:
注意:使用margin : auto在IE8中不起作用,除非声明了!DOCTYPE。
效果图:
2、position: absolute
我们可以使用position: absolute来对齐项目。
示例:
效果图:
3、text-align: center
我们可以在各种标签中使用text-align: center;它可以将任何用HTML编写的文本对齐。
示例:
效果图:
4、line-height属性
想要垂直对齐项目,我们可以使用line-height属性。line-height 属性设置行间的距离(行高)。
示例:
效果图:
5、padding和text-align属性
我们可以使用padding属性和text-align : center的组合来垂直和水平对齐文本。
示例:
效果图:
本文参考地址: https://www.html.cn/qa/css3/10403.html
flex-align:默认是设置垂直方向的对齐方式,值: start、end、center、stretch、baseline。flex-pack:设置子元素之间如何分配多余空间,值:start、end、center、justify。
flex-direction:设置子元素的排列方式, row、row-reverse、column、column-reverse。
flex-wrap:设置子元素的是否自动换行和排列方向,值:nowrap、wrap和wrap-reverse。
-ms-flex:设置子元素弹性,参数,分别是正弹性、负弹性和默认大小。
其实布局还有好多新玩法,你可以多看看相关的教程,比如说现在有个视频的系列名称叫做 《Buid New World》,里面有一集专门讲 CSS3 复杂布局形式