使用css专注于webkit浏览器时保留占位符

Question

我目前有一个未知的浏览器，它会在文本字段聚焦时清除placeholder文本。我怎样才能使用CSS保持文本到位，直到用户输入或者这是不可能的？

我的想法是这样的。占位符不会被删除，而只是使用CSS或其他任何东西隐藏，因此即使默认值不是，也可以操纵它来显示。我希望至少webkit应该具有这样的功能（没有必要在基于webkit的任何其他浏览器中工作）。

以下代码将更改占位符的默认颜色：

[placeholder]::-webkit-input-placeholder {
    color: #888888;
}

欢迎任何答案和/或想法。

Answer 1

您只能为webkit添加-webkit-transition-duration属性，以延迟占位符的消失。但是，当用户开始输入时，您必须使用Javascript将值更改为0s，除非您希望文本和占位符重叠。

示例：

[placeholder]::-webkit-input-placeholder {
    color: #888888;
    -webkit-transition-duration:86400s; // 24 hours
}