html - 防止空格与单词一起换行

Question

描述我的问题的最简单方法是举例：http: //jsfiddle.net/trSwG/1/

第一段很棒，它完全按照我想要的方式显示。无论第一行添加了多少空格，它都会被截断并且不会换行到第二行。

第二段是问题所在。“case”一词前面的空格不应包含在这一行中，我希望它保留在上面的行中，并像第一段中那样。

第三段也可以，这只是为了表明我希望保留空白。还值得注意的是，我不希望单词被破坏（word-break: break-all）。

我在下面附上了一个屏幕截图，以防它在您的浏览器上呈现不同。我正在使用 Chrome 28.0.1500.72 m：

你会注意到我正在使用lettering.js 插件将每个字符包装在一个 span 中，这是我们正在开发的功能所必需的。

到目前为止我学到了什么：

如果您删除刻字呼叫，跨度似乎会导致问题：

//$('p').lettering();

这一切都按我的需要工作。不知何故，跨度的作用与普通文本不同。

更新： html 本身也不能手动编辑。它由 Flash 内容管理工具创建，并与其他属性一起保存为 XML。有数千个这样的 xml 文档。服务器有机会在将 XML 作为 HTML 发送到前端之前对其进行处理，因此任何涉及更改 html 的解决方案都需要编写脚本。

score 0 · Accepted Answer

它已在当前的 beta 版本 29 中得到修复，它被推送到公共版本只是时间问题。

score 0 · Accepted Answer

编辑

简单地在 CSS 中怎么样：

p {
    width: 160px;
    white-space: pre-line;    
    font-family: Arial;
    font-size: 13px;
}
p:last-child {
    white-space: pre-wrap;    
}

2 回答 2