如何在chrome浏览器中为<input />使用`:: selection`？

Question

我正在尝试为输入值设置背景和颜色。我成功地为Mozilla浏览器执行了::-moz-selection，但Chrome中的::selection和Opera等其他浏览器都无法正常工作。

Chrome中的表单屏幕截图 - ::selection。它失败：

Mozilla Firefox中表单的屏幕截图 - ::-moz-selection。 有效：

这是我的代码：

<form>
First name: <input type="text" name="FirstName" value="John"><br>
Last name: <input type="text" name="LastName" value="Doe"><br>
<input type="submit" value="Submit">
</form>

<p>Your first and last name, please!!!.</p>

CSS：

::selection
{
color: #fff;
background: green;
}
::-moz-selection
{
color: #fff;
background: green;
}
input::selection
{
color: #fff;
background: purple;
}
input::-moz-selection
{
color: #fff;
background: purple;
}

有人能告诉我如何使用Chrome和其他浏览器吗？用整个代码here创建了一个小提琴。

更新：我想清楚自己，问题是为::selection内的文字和其他表单字段添加<input>（在第一时间的问题中进行了解释） ）。对于除Firefox以外的浏览器中的普通文本，问题不在于::selection（在Firefox中正常工作）。我在任何浏览器中为非表单元素添加::selection时都没有遇到任何问题。

Answer 1

我认为他们开始支持这个选择器。

::selection选择器为<input>内的文字提供颜色，现在可以在Chrome浏览器上正常使用。您可以检查Chrome上的same snippet进行测试。