HTML 字符串中断

Question

我有以下代码:

    <div style='width:40%'>

       <p> "First Name1 " + FirstName1 + " Last Name1 " + LastName1 + " First Name2 " + FirstName2 + " Last Name2 " + LastName2 + "First Name3 " + FirstName3 + " Last Name3 " + LastName3 .... </p>

    </div>

请注意，我的代码是用程序生成的，但仍然是 HTML 代码。 在我上面的代码中发生的事情是，一旦文本超出 40%，它会在下一行继续，但有时会在名字和姓氏之间中断。 .我希望发生的是，它应该在下一个名字处断开，而不是在名字和姓氏之间的某个地方断开。

因此，我喜欢将名字和姓氏放在同一行上，中间不间断。我尝试了  ，但这并没有解决问题。

如有任何帮助，我们将不胜感激。

Answer 1

几个选项——您可以在代码   中使用不间断空格，而不是在您的名字后面使用常规空格。

或者您可以将您的名字/姓氏包裹在 span 标记中，并为该 span 指定 whitespace: nowrap 的 CSS 属性:

HTML:

<span class="no-wrap">Firstname Lastname</span>

CSS:

.no-wrap {
    white-space: nowrap;
}