很多时候，我们希望列表的最后一行是左对齐排列的，而不是两端对齐，这时候怎么办呢？原理与上面的两端对齐一致。就是复制几个列表元素的外层标签，等宽，但高度为0，里面就是个(不可缺)，复制的个数一般就是每行元素的列表个数啦，这样肯定可以保证最后一行元素一定是左对齐排列的啦！

更多精彩内容请看 web前端中文站
www.lisa33xiaoq.net 可按Ctrl + D 进行收藏

如下HTML代码：

 <div class="box">     
 <span class="list"><img src="lisa33xiaoq.net.jpg" /> 哇哦，美女，口水，鼻血~~~
 </span>     
 <span class="list">
 <img src="lisa33xiaoq.net.jpg" /> 哇哦，美女，口水，鼻血，不行了，我的小兔乱撞~~
 </span>  
 <span class="list">
 <img src="lisa33xiaoq.net.jpg" /> 哇哦，美女，口水，鼻血，不行了，我的小兔乱撞~~
 </span>  
 <!-- web前端中文站：www.lisa33xiaoq.net --> 
 </div>

CSS代码：

 .box{width:50%; 
 padding:20px; 
 margin:20px auto; 
 background-color:#f0f3f9; 
 text-align:justify;} 
 .list{width:120px; 
 display:inline-block; 
 padding-bottom:20px; 
 text-align:center; 
 vertical-align:top;}

运行效果：

以上就是text-align:justify下列表的两端对齐布局的实例，欢迎吐槽！

【注：本文源自网络文章资源，由站长整理发布】