再谈两端对齐

在日常的前端开发中，经常会有这样的情况出现，即在页面中通常会有要二端对齐的需求,当然估计很多同学会笑，笨方法，聪明方法都比较多；如普通计算，由宽得出总值，再计算内部的值；

如ＣＳＳ3　也可以做到，text-align:justify　flex flex-wrap 等等，但都需要折腾代码；今天教给大家一个偏门知识点；浮动左对齐，二端对齐；不说了，下代码；纯ＣＳＳ实现，以下是要实现一个多行，5例的图片排例；自动拿去演示；

<code>

.item {

float: left;

margin-right:40px;

color: #6c6c6c;

width: 206px;

height: 312px;

overflow: hidden;

position: relative;

background:#fff;

}

.item:nth-child(5n+5) {

margin-right: 0;

}

.img{

display: block;

width: 100%;

height: 100%;

-webkit-transition: opacity 0.2s;

-moz-transition: opacity 0.2s;

-o-transition: opacity 0.2s;

transition: opacity 0.2s;

}

</code>