text-align:justify无效解决办法

放肆的年华 提交于 2019-12-02 02:39:23

text-align实现两端对齐文本效果,但是要特别注意text-align不会处理被打断的行和最后一行
如果你的文字只占了一行,同事它也是最后一行了,所以text-align设置为justify不会产生任何效果。
解决方法是使用text-align-last,并将其设置为justify。
不过不幸的是,text-align-last不是所有浏览器支持。

所以对于不支持text-align-last的,可以在最后一行人工生成两行文本,然后把第二行隐藏了,那么我们要现实的第一行自然就可以实现两端对齐了。

例:

我是一行字

.center{
text-align:justify;
}

span{
display:inline-block;
width:100%;
}

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!