CSS怎样修改chrome记住密码后自动填充表单的黄色背景？

Posted 2022-12-02 前端向朔

问题跟踪：https://github.com/haizlin/fe-interview/issues/95

倒是一直没注意过这个问题，搜了下思否已经有提问和回答，基本也能解决问题，包括上面的两个回答，同时CSDN的账号登录也是用上面内阴影的方法解决的。
https://segmentfault.com/q/1010000000671971

以下才是重点：
都提到了Chrome有默认样式，说“除了chrome默认定义的background-color，background-image，color不能用 !important 提升其优先级以外，其他的属性均可使用!important提升其优先级。”
可是这是为什么啊？

原来重置样式是这样的：

input:-webkit-autofill-strong-password 
    -webkit-text-security: none !important;
    -webkit-user-select: none !important;
    cursor: default !important;
    font-family: monospace;


input:-webkit-autofill, input:-webkit-autofill-strong-password 
    background-color: #FAFFBD !important;
    background-image: none !important;
    color: #000000 !important;

都加上了important，后面当然没办法重置啦，Chrome也是够横的。

webkit 内核浏览器，默认样式：http://trac.webkit.org/browser/trunk/Source/WebCore/css/html.css

全文关于autofill 的就这两条，所以严肃质疑网上给出的默认样式：
input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill，不靠谱！