html - 如何删除对齐的CSS中的空白

Question

如果我正在使用
text-align:justify
段落在单词之间显示不需要的空间以保持指定的宽度。在互联网上搜索但没有得到任何正确的结果。我也用了 white-space 但没用

fiddle :fiddle

Answer 1

最接近的解决方案是使用 word-break: break-all 但这也会中断单词。如果您对此没问题，那么请使用此解决方案:

.sample_test p{
    word-break: break-all;
}

Fiddle

编辑(2021 年 11 月)

其他最接近的更好的解决方案是使用 hyphens: auto .我们必须向 HTML 元素提及全局属性 lang 才能使其正常工作:

.sample_test {
  display: block;
  margin: 0 auto;
  width: 400px;
  height: auto;
}

.sample_test p {
  /* word-break: break-all; */
  hyphens: auto;
}

<div class="sample_test" lang="en">
  <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it.</p>
  <p>Contrary to popular belief,.. It has roots in a piece of classical Latin literature from 45 BC,</p>
  <p>There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use a passage of Lorem Ipsum,
    you need to be sure there isn't anything embarrassing hidden in the middle of text. All the Lorem Ipsum generators on the Internet tend to repeat predefined chunks as necessary, making this the first true generator on the Internet. It uses a dictionary
    of over 200 Latin words,</p>
</div>