javascript - 如何将光标位置放在 contenteditable 元素的居中对齐占位符的开头？

Question

我有以下代码:

HTML:

<div class="title" contenteditable="true" placeholder="Title"></div>

CSS:

.title {
   width: 500px;
   margin: 0 auto;
   text-align: center;
}

[contenteditable=true]:empty:before{
   content: attr(placeholder);

}

它会生成一个带有占位符的居中对齐的可编辑 div。我的问题是，当元素第一次聚焦时，光标位于 div 的开头，而不是占位符所在的位置:! http://screencast.com/t/66HWb3wKiV

我希望占位符在实际键入字符之前保持可见，光标位于占位符的开头。我怎样才能做到这一点？

谢谢!

Answer 1

我有解决此问题的方法。

改变你的CSS:

.title {
   width: 500px;
   margin: 0 25%;
}