在contenteditable / WYSIWYG中创建一个牢不可破的元素

Question

我希望能够创建一些不能分成两部分的元素（分开）。简单来说，我想在Firefox中使用此代码时获得效果：

  <div contenteditable>
    <img src="MRC" title="Some info about this element"  alt="text t be displayed" />
  </div>

事实上我确实想使用img，但遗憾的是这不适用于跨浏览器（IE显示丢失的图片指示器，Chrome根本不显示alt，Opera总是显示边框）。

此外，我想有一个选项来包装我目前用于“alt”的文本，这似乎在任何浏览器中都不起作用。

在这里使用img最有价值的事情是alt文本可以使用外部标记格式化（例如，使其变为粗体）。

Answer 1

嵌套不可编辑的元素：

<div contentEditable="true">
    <span contentEditable="false">Text to be displayed</span>
</div>