html - text-align justify 就像在 word 中一样

如何在整个行宽上使用 text-align: justify; 和文本中的换行符转换段落？

HTML 默认是将带有换行符的行向左对齐。
我喜欢将它转换到整个线宽上，就像在 word 和其他排版软件中一样。

为避免误解，澄清打印软硬包装:

软包装:换行
硬换行:段落中断/和新段落的开始

证明类型转换词



证明转换网络浏览器

<p style="text-align: justify; font-family: Arial, Lora, Open Sans;">This text has text-align: justify; in the web browser as you can see in this paragraph. Now soft wraps follow.<br>
    This is a test<br>
    to show how text<br>
    is cast in word<br>
    And the text is aligned to left in stead of casting it to 100% width.</p>

最佳答案

我认为问题在于您的文本没有像在 MS Word 中那样按行分隔。

注意 请记住，您不能在 CSS 中对齐单行。要使用 :after 元素修复使用 hack:

p {
  text-align: justify;
}

p:not(:last-child):after {
  content: "";
  display: inline-block;
  width: 100%;
}

<div>
  <p>
  This is text
  </p>
  <p>
  to show how text
  </p>
  <p>
  is cast in word
  </p>
</div>

关于html - text-align justify 就像在 word 中一样，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/43180954/