html - 如何在不使用 "justify"的情况下进行文本对齐？

Question

我的问题是，在我的网页中，我想创建报纸的设计，我需要将文本与通常在 css 中我们可以使用以下代码完成的对齐方式放置:

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

}

问题在于，结果会在单词之间创建空白，从而破坏了整个文本的易读性和图形，如下图所示:

有谁知道如何解决这个问题吗？或者是否存在任何 javascript 方法来获得更好的结果？此外，我的页面是响应式的，因此当我将窗口缩小时，问题就更大了。

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

Answer 1

使用分词代替

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