<!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>
上述的代码应该是兼容所有浏览器的,有个注意点特别强调:文字与文字之间必须加空格!