text-align:justify两端对齐失效问题说明

问题：

text-align:justify在一段换行的文字中是可用的，但是在键值形式中，是无效的；

原因：

justify对最后一行是无效的。对齐键值时，因为只有一行，也就是最后一行，所以无效果。
ex：姓名：王小小

解决办法：

增加一个空标签，让浏览器将文字默认为非最后一行即可：

<div>
	<span class="contentName">姓名<i></i></span>
	<span>：</span>
 	<span>王小小</span>
</div>

样式：

.contentName
    display inline-block
    min-width .7rem
    text-align justify
    margin-bottom .23rem
    height .21rem
    line-height .21rem
    overflow hidden
    vertical-align top
    i
       display inline-block
       width 100%
       height 0

注意：

1：contentName要设置inline-block;同行显示，设置width让换行；
2：必须设置height，overflow:hidden，否则还是会占高度；
3：vertical-align:top;让文字高度对齐；
这3条，若不设置，则会变成下图的样式：

正常样式如下：

备注：

除了上述的方法外，还常会使用下述三种空格来填充使得两端对齐；
 
 （半个中文空格）
 （一个中文空格）

但此方式，在手机浏览器上依然会无法对齐；
所以作者当前依然推荐最上方的方式来做两端对齐；
完成！！！