如何保留换行符但具有文本对齐:对齐

Question

我有根据需要有换行符的文本，我不想在每行后添加一个<br/>，所以我使用white-space: pre-wrap.我也想text-align:justify。但它们似乎不能一起工作。

有没有办法克服这个问题？

Answer 1

你想要的是white-space:pre-line，而不是pre-wrap。

而且你还需要text-align-last，因为text-align本身不会削减它。

div {
  white-space: pre-line;
  text-align: justify;
  -moz-text-align-last: justify;
  text-align-last: justify;
}

<div>one two three four
five six seven etc etc etc</div>

Answer 2

您可以通过在

包含文本的元素（或任何父元素）上使用 css 中的 max-width 属性来获取要自动换行的文本

p{
 max-width:300px;
 text-align:justify;
}

<p>dfhdbh dgg dd ew asdf dhfdhfh d hdhfbk djdbjbk dhdbhfbd jkbfjbdjk hdjkhjkdh dhfjkdhkfjgdfkdj df djfhkdjfh hdfbdh dfdhf fdhgdgds sdh dfhdbvdhg shdgh dfhf dfhdff fhddh fhfgdssdsew dfhgseey dhd ff fhde fheybd dfhey sd wyo gfj fggn cjvnf jcnjf fjncj fju djfu dcjndf  </p>