如何使用 HTML 和 CSS 覆盖浏览器表单自动填充和输入突出显示？

覆盖浏览器表单自动填充和输入突出显示

在单个页面上处理多个表单时，通常会遇到自动填充问题- 填充和不需要的突出显示。本文解决了这些问题，重点介绍如何利用 HTML/CSS 禁用自动填充并覆盖黄色突出显示。

禁用自动填充

之前的解决方案涉及在较新的 Chrome 版本中，在阴影内使用强元素已经过时。另一种方法是通过以下方式抑制自动填充：

<input autocomplete="off" ...>

覆盖突出显示颜色

要覆盖不需要的黄色突出显示，请应用以下 CSS 规则：

input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 50px your_background_color inset;
    -webkit-text-fill-color: your_font_color;
}

将“your_background_color”替换为所需的背景颜色，将“your_font_color”替换为所需的字体颜色。

注意：此解决方案可能无法在所有浏览器中完全有效。某些浏览器，例如 Firefox，可能仍会显示淡黄色突出显示。

以上是如何使用 HTML 和 CSS 覆盖浏览器表单自动填充和输入突出显示？的详细内容。更多信息请关注PHP中文网其他相关文章！