chrome密码管理自动填充的字体如何修改

Question

1.项目登录页,刚进入时是chrome密码管理自动填充的账号密码,这个字号是固定的,很小

2.鼠标点击界面,输入框的字号恢复成正常设置的大小(18px)

3.问题:整体看会有一个字体由小变大的过程,希望不改变输入框设置的字号大小保持整个过程字号大小一致,请问该如何解决?
4.两个方案:(1)获取chrome密码管理中保存的数据,但是现在不清楚如何获得

      (2)模拟选中某条记录的触发事件.我试过触发页面的点击事件,模拟正常操作中点击页面的操作,但是没有效果

Answer 1

虽然过了挺久了，但我相信还是有很多人在找这个问题的处理方式
以下方案在chrome 85 上运行正常

 input {
          font-size: 24px;
          border: 0;
          line-height: 40px;
          // 清空点击高亮
          -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
          // 自动填充样式
          &:-webkit-autofill {
            box-shadow: 0 0 0 1000px #f5f5f5 inset !important;
            -webkit-box-shadow: 0 0 0 1000px #f5f5f5 inset !important;
            -webkit-text-fill-color: #666 !important;
          }
          // 自动填充文本样式
          &:-webkit-autofill::first-line {
            font-size: 24px;
          }
        }

其中关键的是
-webkit-autofill::first-line
可以定义自动填充时的字体大小等样式
希望可以帮到有缘人

Answer 2

我也遇到了这个问题，现在是禁止chrome自动填充账号密码，autocomplete = 'new-password'，
参考：https://segmentfault.com/q/10...
你现在是怎么解决的？