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

Question

我正在尝试为输入值设置背景和颜色。我成功了 ::-moz-selection对于 Mozilla 浏览器，但是 ::selection在 Chrome 和 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 和其他浏览器一起工作？用整个代码创建了一个 fiddle here .

更新:我想弄清楚问题是关于添加 ::selection对于里面的文字 <input>和其他表单字段(首先在问题中解释)。问题不在于 ::selection对于 Firefox 以外的浏览器中的普通文本(在 Firefox 中工作正常)。我添加 ::selection 从来没有遇到过问题适用于任何浏览器中的非表单元素。

Answer 1

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

::selection选择器为 <input> 中的文本指定颜色现在在 Chrome 浏览器上运行良好。您可以查看 same snippet在 chrome 上进行测试。