如何在不使用＆＃34;对齐＆＃34;的情况下进行文本对齐？

Question

我的问题是，在我的网页中，我想要创建一个报纸的设计，我需要将我的文本放在css中，通常在css中我们可以使用这段代码：

.text-art{
    text-rendering: optimizeLegibility; 
    text-align: justify;
    word-spacing: -1px; 

}

问题是结果会在废弃易读性的单词和整个文本的图形之间创建空格，如下图所示：

有谁知道我该如何解决这个问题？或者，如果存在任何javascript方式来获得更好的结果？此外，我的页面是响应性的，所以当我把窗口做得很少时，问题就更大了。

希望你能帮助我！提前致谢！

Answer 1

使用word-break代替

.text-art{
    text-rendering: optimizeLegibility; 
    word-break: break-all;
}

Answer 2

您的问题与行长度有关。你的行在单词/行上太短了。这就是为什么单词之间的空间是明显的。

您有几个选择：

1. 使用较小的字体大小，以便每行都有更多单词
2. adjust letter-spacing
3. 使用左对齐

对于小窗口，我会选择较小的字体。