Html 词中有图像时防止词断裂

根据网页设计，有一个图像用来代替“O”字母（有时）
问题是：当调整窗口大小时，有时图像后面的部分单词会转到新行
期望的行为：如果不合适，整个单词应该转到新行。
是的，我可以用css规则

空白：nowrap

用

标记来包装这些单词，但这不是一个理想的解决方案，因为客户端希望能够在Wordpress visual editor中编辑这些单词。
有没有关于如何防止内部有图像的单词破裂的想法？
-调整窗口大小以查看问题

p{
字体大小：40px；
字体大小：粗体；
字体系列：无衬线；
}
img{
垂直对齐：中间对齐；
}

---

这是loooooooooooord

看起来您需要nobr标签：

p{
字体大小：40px；
字体大小：粗体；
字体系列：无衬线；
}
img{
垂直对齐：中间对齐；
}

---

这是looooooooord

是的，它不是所有现代浏览器都支持的标准版本，另请参见我认为，如果您的客户端无法更改html，您需要一些javascript。。。基本上，搜索/替换所需的部分，并在新的html中用图像包装单词，由css控制，您可以添加到主题中。。。