调整大小时避免在两个单词之间断开行。

Question

我有一个字符串，我需要它不要把两个特定的单词分成不同的行。例如：

"Ask for it it when contracting until 2016/09/30 with T-2 Rate"

当我调整窗口大小并使其变小时，它会输出一个时刻：

"Ask for it it when contracting until 2016/09/30 with T-2 \n
Rate"

我希望T-2 + Rate始终在一起，如何做到？

- Verònica Jandrew

---

你能发布你的代码并告诉我们你已经尝试过什么吗？ - Reinstate Monica Cellio

请发布你的代码？ - Hitesh Misro

为什么不在较小的分辨率下使用特定宽度来设置段落，这样它将保留特定的单词，然后再进行换行。 - Samir

Answer 1

您使用了一个不间断空格。它的HTML实体是 。在T-2中，您可能还需要一个非断开连字符(‑)：

Ask for it it when contracting until 2016/09/30 with T‑2 Rate

示例：

var target = document.getElementById("target");
var originalWidth = target.innerWidth || target.clientWidth;
var width = originalWidth;
tick();
function tick() {
  width = width < 10 ? originalWidth : (width - 10);
  target.style.width = width + "px";
  setTimeout(tick, 400);
}

#target {
  display: inline-block;
  border: 1px solid #ddd;
}

<div id="target">Ask for it it when contracting until 2016/09/30 with T&#8209;2&nbsp;Rate</div>

- T.J. Crowder

---

你能将这个问题放到https://dev59.com/32sz5IYBdhLWcg3w-85v吗？ - Michał Perłakowski

Answer 2

Just use <span style="white-space: nowrap"> for nonbreaking parts, as MDN states.

Ask for it it when contracting until 2016/09/30 with <span style="white-space: nowrap">T-2 Rate</span>

- Nina Scholz