为什么 - webkit-apperance：不需要样式输入[type =“ search”] :: - webkit-search-cancel-button

Question

我有一个CSS元素，例如以下给出：

<input type="search" />

CSS以下的元素上方的样式：

input[type="search"]::-webkit-search-cancel-button{
    -webkit-appearance: none;
    background: yellowgreen;
}

为什么

-webkit-appearance: none;

对于我上面提到的伪级就像伪级一样重要？

如果我只想更改交叉图标的颜色，该怎么办？

Answer 1

Non-nastard：此功能是非标准的，并且不在标准轨道上。 请勿在面对网络的生产站点上使用它：它不会适用于每个用户。实施和行为之间可能会发生很大的不兼容。

Source：

Https：//developer.mozilla.org/en-us/docs/web/css/ ::-webkit-search-cancel-button

这种样式的其他浏览器引擎（例如Firefox）根本不显示的UI元素，这就是为什么仅适用于浏览器前缀的样式选项。