如何在文本中使用 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 中对齐单行。要修复此问题,请使用 hack 和 :after
元素:
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 - 文本对齐像在 word 中一样对齐,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43180954/