<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>文本两端对齐</title>
<style>
.justify{
100%;
text-align: justify;
text-justify: distribute-all-lines; /*ie6-8*/
text-align-last: justify; /* ie9*/
-moz-text-align-last: justify; /*ff*/
-webkit-text-align-last: justify; /*chrome 20+*/
}
@media screen and (-webkit-min-device-pixel-ratio:0) {/* chrome*/
.justify:after {
content: ".";
display: inline-block;
100%;
overflow: hidden;
height: 0;
}
}
</style>
</head>
<body>
<div class="justify">在 Google 上 班 日 子 到 底 有 多 么 不 同</div>
</body>
</html>
上述的代码应该是兼容所有浏览器的,有个注意点特别强调:文字与文字之间必须加空格!