如何使用CSS防止列表项中的换行符

我正在尝试使用标签在菜单中放置一个名为“ 提交简历”的链接li。由于两个单词之间存在空格，因此将其包装为两行。如何防止CSS包裹？

使用white-space: nowrap;^{[1] [2]}或通过将li的宽度设置为更大的值来给该链接更多的空间。

^[1] §3.空格和环绕：空格属性-W3 CSS文本模块级别3
^[2] 空格-CSS：级联样式表| MDN

如果内容较大以适合一行，则可以添加以下代码片段以在行尾添加漂亮的“…”：

li {
  overflow: hidden; 
  text-overflow: ellipsis;
  white-space: nowrap;
}

如果要有选择地实现此目的（即：仅到达该特定链接），则可以使用不间断的空间而不是普通的空间：

<li>submit&nbsp;resume</li>

https://en.wikipedia.org/wiki/Non-breaking_space#Encodings

编辑：我知道这是HTML，而不是OP要求的CSS，但有些人可能会觉得有帮助…

显示：inline-block; 可以防止列表项中的单词之间出现断线

 li {
    display: inline-block;
 }

Bootstrap 4有一个名为的类text-nowrap。这正是您所需要的。