CSS中的“\a”命令生成一个回车。这是CSS，不是HTML，所以它应该更接近你想要的:没有额外的标记。

在一个blockquote中，下面的例子同时显示标题和源链接，并用回车符("\a")分隔两者:

blockquote[title][cite]:after {
  content:attr(title)"\a"attr(cite)
}

设置一个br标记来显示:none是有帮助的，但是你可以用WordsRunTogether结束。我发现用空格字符代替它更有帮助，就像这样:

HTML:

<h1>
    Breaking<br />News:<br />BR<br />Considered<br />Harmful!
</h1>

CSS:

@media (min-device-width: 1281px){
    h1 br {content: ' ';}
    h1 br:after {content: ' ';}
}

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

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

使用overflow-wrap: break-word;如:

.yourelement{
  overflow-wrap: break-word;
}

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

p {
    width : 12ex;
}

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

如果这能帮助到某人…

你可以这样做:

<p>This is an <a class="on-new-line">inline link</a>?</p>

用这个css:

a.on-new-line:before { 
  content: ' '; 
  font-size:0; 
  display:block;
  line-height:0;
}