javascript - <* 文本对齐 :justify *> functionality For divs (boxs)

Question

我有很多不同尺寸的盒子；尺寸未知。我想使用与 text-align:justify 一样的 CSS 规范。例如:

我想要一个 CSS 或 CSS3 的解决方案。如果不行，JS也可以。

Answer 1

可能的 CSS 解决方案

如果框设置为 display:inline-block，您可以像处理文本一样应用 text-align:justify。但是请注意，text-align:justify 对文本的最后一行没有任何影响。因此，如果只有一行需要对齐，则什么也不会发生。

一个解决方法是，如果您可以修改 HTML，则添加一个宽度为 100% 的尾随元素，以确保您要对齐的内容不是最后一行。如果您无法修改源 HTML，可以使用 JavaScript 附加尾随元素。

这是一个 jsfiddle证明这一点。在 IE6/7/8/9、Firefox、Chrome、Safari 中测试。 (注意:必须在框之间添加   才能使其在 IE6/7 中工作)。