html - 在 HTML5 中将带有文本的图像分组到不可自动换行的组中

Question

在 HTML 中，是否有可能有一组不能被自动换行破坏的图像和文本？即要么一起呈现在一行上，要么一起包裹到下一行？

这可以通过使用单词来完成， 但我想在该组中添加一个字母大小的小图标。

例子：

<p>
  Some some normal, wrappable text 
  <span class="unbreakable"><a><img src="logo.png"></a>&nsbp;<a>Product&nbsp;Name</a></span>
</p>

注意。为简洁起见，我已从<a>标签中删除了属性。

目前，“logo.png”图像可能出现在一行，“产品名称”出现在下一行。

这段代码是可调整大小元素的一部分，有时它能够在 1 行上呈现，其他则需要，所以我不想在不需要<br>的时候强制 a。

Answer 1

从评论扩展：

当您想将徽标和产品名称组合为一个整体“不可包装”部分时，您可以使用white-space:nowrap：

小提琴

.unbreakable
{
  white-space:nowrap;
}