text-align:justify 两端对齐

beyes

有时候可能需要两端对齐，那么需要用到 text-align:justify 属性。在用该属性时，应该配合 width 宽度属性来使用，否则书写的内容会一直走到浏览器窗口的右侧尽头然后换行。

如果写的是英文，那么仅用该属性即可；如果写的内容是中文，那么还需要加上 text-justify:distribute-all-lines;  这个属性。

先试看一下，不加 text-justify:distribute-all-lines;  时显示的效果：


上图可以看到，右侧是不太整齐的。那么将上 text-justify:distribute-all-lines;  看看：

1.         <p style="text-align: justify; text-justify:distribute-all-lines;  width:200px">
   
2. 新浪体育讯　　
   
3. 在击败阿根廷河床后，巴萨拿到了世俱杯的冠军，这也是巴萨本年度拿到的第五个冠军奖杯，今年的巴萨足够伟大，球队先后战胜过英超、法甲、德甲和意甲冠军，此外还战胜了欧洲联赛杯冠军、亚洲冠军和美洲冠军，堪称世界足坛的王中王，然而和2009年瓜迪奥拉的“梦三”相比，巴萨仍有遗憾，那就是未能拿下西班牙超级杯冠军，在冠军数量上比瓜迪奥拉的六冠王少一冠。
   
4.         </p>

复制代码

显示效果：


如上图可见，对齐效果已经非常完美。