contenteditable

最近用了一下:contenteditable,这个属性可以让一段HTML标签内容可以编辑,非常不错的属性,回车换行时会自动识别使用什么标签。

但是发现编辑span的时候,会发生移位。

原始:
contenteditable

删除后发生位移:
contenteditable

于是我添加了:display:inline-block;padding:0 1px;就可以了。

注意,后面的padding一定要有,不然光标不会出现。
后来试了几次其实只需要:padding:0 1px;就可以了。

如果你不想要拼写检查功能可以加属性:spellcheck="false"

DEMO地址:http://www.acgist.com/demo/contenteditable/index.html

还有可以使用一些加粗等一些简单命令来打造一个简单的编辑器:http://www.acgist.com/article/282.html