应用CSS3进行弹性布局时内容对齐的办法详解-
内容对齐（justify-content）属性利用在弹性容器上，把弹性项沿着弹性容器的主轴线（main axis）对齐。
该操纵产生在弹性长度以及主动边距被肯定后。 它用来在存在剩余空间时怎样加以分配，也会在产生内容溢出时影响项目的对齐。
注意：弹性布局中有两个根本术语main axis和cross axis，个别状况下，我们可以把它们各自看作是屏幕上的行向和列向（但是严厉讲，这和写模式以及弹性流标的目的有关）。
那么main-start和main-end就可以离别被看作是弹性容器的摆布边。
justify-content语法如下：
justify-content: flex-start | flex-end | center | space-between | space-around
参数注明如下：
flex-start
弹性项目向行头紧受着添补。这个是默许值。首先个弹性项的main-start外边距边线被放置在该行的main-start边线，而后续弹性项顺次平齐摆放。
flex-end
弹性项目向行尾紧受着添补。首先个弹性项的main-end外边距边线被放置在该行的main-end边线，而后续弹性项顺次平齐摆放。
center
弹性项目居中紧受着添补。（要是剩余的自在空间是负的，则弹性项目将在两个标的目的上同时溢出）。
space-between
弹性项目均匀散布在该行上。要是剩余空间为负或者只要一个弹性项，则该值等同于flex-start。不然，第1个弹性项的外边距和行的main-start边线对齐，而最后1个弹性项的外边距和行的main-end边线对齐，然后剩余的弹性项散布在该行上，相邻项目的隔断相称。
space-around
弹性项目均匀散布在该行上，两边留有一半的隔断空间。要是剩余空间为负或者只要一个弹性项，则该值等同于center。不然，弹性项目沿该行散布，且相互隔断相称（比方是20px），同时首尾两边和弹性容器之间留有一半的隔断（1/2*20px=10px）。
justify-content属性取值结果示例
上图很直不雅的演示了以上5个取值的结果和悬殊。
以上就是应用CSS3进行弹性布局时内容对齐的办法详解的细致内容，更多请关注 百分百源码网 其它相干文章！
