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

p {
    width : 12ex;
}

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

我猜您不希望使用断点，因为它总是会断行。对吗?如果是这样，如何在你的文本中添加一个断点<br />，然后给它一个类，如<br class="hidebreak"/>，然后使用媒体查询右上方的大小，你想要它打破隐藏<br />，所以它打破在一个特定的宽度，但保持内联以上的宽度。

HTML:

<p>
The below line breaks at 766px.
</p>

<p>
 This is the line of text<br class="hidebreak"> I want to break.
</p>

CSS:

@media (min-width: 767px) {
  br.hidebreak {display:none;}
}

https://jsfiddle.net/517Design/o71yw5vd/

您需要声明<span class="class_name"></span>内的内容。过了它，线就断了。

\A表示换行字符。

.class_name::after {
  content: "\A";
  white-space: pre;
}

如果这能帮助到某人…

你可以这样做:

<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;
}

在我的例子中，我需要一个输入按钮前面有一个换行符。 我应用如下样式的按钮，它工作:

clear:both;

要使元素在后面有换行符，为它赋值:

显示:块;

块级元素之后的非浮动元素将在下一行出现。许多元素，如<p>和<div>已经是块级元素，所以您可以只使用它们。

But while this is good to know, this really depends more on the context of your content. In your example, you would not want to use CSS to force a line break. The <br /> is appropriate because semantically the p tag is the the most appropriate for the text you are displaying. More markup just to hang CSS off it is unnecessary. Technically it's not exactly a paragraph, but there is no <greeting> tag, so use what you have. Describing your content well with HTMl is way more important - after you have that then figure out how to make it look pretty.