这适用于Chrome浏览器:

p::after {
  content: "-";
  color: transparent;
  display: block;
}

Vincent Robert和Joey Adams的答案都是正确的。但是，如果您不想更改标记，可以使用javascript插入一个<br />。

在CSS中，不改变标记是无法做到这一点的。

下面是一个糟糕问题的糟糕解决方案，但它确实符合概要:

p {
    width : 12ex;
}

p:before {
    content: ".";
    float: right;
    padding-left: 6ex;
    visibility: hidden;
}

有几个选项可以定义空格和换行符的处理。 如果你可以把内容放在<p>标签中，你就很容易得到你想要的东西。

要保留换行符而不保留空格，请使用pre-line(而不是pre)，如in:

<style>
 p {
     white-space: pre-line; /* collapse WS, preserve LB */
   }
</style>

<p>hello
How are you</p>

如果需要另一种行为，请选择其中之一(WS=WhiteSpace, LB=LineBreak):

white-space: normal;   /* collapse WS, wrap as necessary, collapse LB */
white-space: nowrap;   /* collapse WS, no wrapping,       collapse LB */
white-space: pre;      /* preserve WS, no wrapping,       preserve LB */
white-space: pre-wrap; /* preserve WS, wrap as necessary, preserve LB */
white-space: inherit;  /* all as parent element */

资料来源:W3学校

基于之前所说的，这是一个工作的纯CSS解决方案。

<style>
  span {
    display: inline;
  }
  span:before {
    content: "\a ";
    white-space: pre;
  }
</style>
<p>
  First line of text. <span>Next line.</span>
</p>

也许有人会有和我一样的问题:

我在一个带有display: flex的元素中，所以我必须使用flex-direction: column。