Html 如何在ms edge中删除输入的边框和背景

当带有

建议文本的下拉菜单打开并悬停输入时，它会出现。

设置焦点、活动、悬停样式没有帮助。它看起来好像已经过时了。


如何删除Edge中输入文本的边框和背景

更新

如果没有css解决方案，有人能给我一个链接来回答这篇文章的工作原理和/或给我提供一个javascript解决方案（我希望它像google.com搜索输入一样）。
最好关闭
自动完成


根据您自己的猜测，文本框下方显示的自动完成列表不在DOM中，因此CSS无法将其作为目标

从我在codepen上的实验来看，Edge似乎在文本框上覆盖了一个半透明的元素（高度和宽度都匹配），而不是应用于文本框本身的样式

显示关闭“自动完成”时样式的变化。您将看到，通过链接
：hover
和
：focus
伪类，当将鼠标悬停在已处于焦点的文本框上时，我可以创建一种不同的样式（当处于焦点时为蓝色，当鼠标悬停在处于焦点的同一文本框上时为红色）

当查看（显然是在Edge中）已启用“自动完成”时，这一点值得注意。当你点击文本框时，背景颜色是红色（正如预期的那样——我在一个聚焦的文本框上悬停）。但是，轻轻移动鼠标，背景变为蓝色，表示文本框处于活动状态，但不再悬停。这是不正确的-我们仍然在它上面徘徊

这可能是Edge的一个怪癖，也可能是浏览器处理自动完成的一个缺陷。这可能值得向微软提出——他们的网站上似乎没有列出任何与此相关的内容

我提供的第一个链接中给出的一个答案建议使用。当浏览器默认情况下应该这样做时，这有点麻烦，但您将能够针对自动完成列表的样式，从理论上讲，避免您遇到的问题。
您必须在
输入
字段中添加
autocomplete=“off”


和

如果它是一个动态元素，或者您不能将其添加到
输入中，那么您可以使用一个简单的脚本来完成

$（'input'）.attr（'autocomplete'，'off'）

可能对您有用
我还没有测试过它，我现在没有访问IE的权限，但在其他浏览器中，一些默认行为可以使用CSS进行更新。希望它能帮助您：

appearance: none;
-webkit-appearance: none;
-moz-appearance: none;

你能分享你的HTML和CSS片段吗？请提供fiddle或HTML代码。没有完全让我满意的答案。但我想奖励这一个，因为它试图理解问题，并建议在不放弃下拉列表的情况下解决我的问题。@g1un-我很感激它，尽管很遗憾我们找不到更好的解决方案。我想我无论如何都会把这个问题记录在微软的日志上，只是为了让他们接受它。如果他们真的解决了这个问题，那就少了一个浏览器上的怪癖了。这与这个问题有关吗？@DanielRuf-我从来没有抽出时间来记录它，但我在代码笔中演示的问题现在似乎在Edge中按预期工作。到目前为止，我们还不能用CSS解决它，而且似乎还没有解决方案。事实上，这在Microsoft Edge 42.17134.1.0中无法解决此问题