当文本对齐居中时，插入符号出现在占位符onfocus的末尾

Question

这不是非常重要，我通过添加：

相当容易地解决了这个问题

 onfocus="this.placeholder = '';" onblur="this.placeholder = 'Search...';"

然而，出于好奇，如何做到这一点？ 这是小提琴：https://jsfiddle.net/vjLvssmp/

在CSS中是否有一种方法或者它需要JS？

谢谢， 约翰

Answer 1

- 编辑

您可以使用 text-indent 和占位符选择器来完成此操作。

.whitesearch {
  ...
  text-indent: 45px;
}

.whitesearch::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  text-indent: 0px;
}

这是一个例子。 https://jsfiddle.net/nonyok0q/3/