display:inline-block;
padding-left:100%;
}
想想还有一些小激动呢，而且完美兼容 ie 和 safari，这种方案其实就是第一种段落对齐方案的扩展，用空格强制分词，然后用 span 伪造最后一行（test-justify 不会对最后一行进行对齐）。
为了增加扩展性，我们还得对这种方案进行优化，因为大多数情况下文本是后端加载的。
例如 .net core razor 视图加载 model displayname 的写法
<label asp-for="Email"></label>只要加一小段js然后就应该能兼容所有场景了。
css
div {
width: 300px;
border: 1px solid #000;
}
.test-justify {
text-align: justify;
}
span {
display:inline-block;
padding-left:100%;
}html
<div class="test-justify">
测试文本
</div>js
var $this = $(".test-justify")
, justifyText = $this.text().trim()
, afterText = "";
for (var i = 0; i < justifyText.length; i++) {
afterText += justifyText[i] + " ";
}
afterText = afterText.trim() + "<span></span>";
$this.html(afterText).css({ "height": $this.height() / 2 + "px" });
好了，这种方案应该能支持主流的浏览器了，但缺点是由于通过js再调整的，所以刷新的时候仔细看会看到文本两端对齐的过程（闪一下），体验并不是很好，那就做一下兼容吧。
只有 IE 和 Safari 不支持
text-align-last: justify 所以只考虑这两种浏览器的情况下调用最后一种方案
function myBrowser() {
var userAgent = navigator.userAgent; //判断浏览器版本
var isOpera = userAgent.indexOf("Opera") > -1;
var isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1 && !isOpera;
var isEdge = userAgent.toLowerCase().indexOf("edge") > -1 && !isIE;
var isIE11 = (userAgent.toLowerCase().indexOf("trident") > -1 && userAgent.indexOf("rv") > -1);
if (/[Ff]irefox(/d+.d+)/.test(userAgent)) {
return "Firefox";
} else if (isIE) {
return "IE";
} else if (isEdge) {
return "IE";
} else if (isIE11) {
return "IE";
} else if (/[Cc]hrome/d+/.test(userAgent)) {
return "Chrome";
} else if (/[Vv]ersion/d+.d+.d+(.d)* *[Ss]afari/.test(userAgent)) {
