被Chrome重写的css

Question

有人能解释一下吗？

因此该工具显示rgb（250,255,189）被鲑鱼取代（因为rgb被划掉）尽管鲑鱼是显示的，但摘要行和显示的实际颜色是rgb（250 ... ）颜色！

自动填充css似乎覆盖了我们可能想要设计的任何内容，但即便是Chrome开发人员工具也似乎不知道如何解释它......

我有一个比用户代理样式表更具体的规则，相同的定义，但也指定了类，但Chrome的自动填充功能仍然在赢 - 任何解决方案？

感谢

Answer 1

您可以尝试<li > <label for="sectiona" class="showhide">Search for a term</label> <input type="checkbox" id="sectiona" value="button" style="display:none;"/> </li>

＆＃13;

＆＃13;

-webkit-autofill

＆＃13;

input {
  background-color: white;
}
/*input:focus {
  background-color: grey
}*/
input:-webkit-autofill{
  transition: background-color 1s ease-in-out 5000s;
}

body {
  background: #333;
  color: #fff;
  display: flex;
  font-size: 2em;
  justify-content: center;
}

＆＃13;

＆＃13;

＆＃13;

Answer 2

我认为你实际上遇到了webkit-autofill的问题。但是，如果Chrome自动填充您的输入字段，该颜色应该只显示。可能是它。

看一下MDN的这句话：

https://developer.mozilla.org/en-US/docs/Web/CSS/:-webkit-autofill

  

许多浏览器的用户代理样式表在其中使用！important： -   webkit-autofill样式声明，使得它们不会被网页覆盖，而不会诉诸JavaScript攻击。

所以我猜这可能是一个问题。您是否尝试在隐身窗口中查看该页面？因此，Chromes自动填充功能无法启用？