Chrome 登录时Input输入框autocomplete=“true“历史记录框样式修改

当你设置input属性autocomplete=“true"时
普通文本框添加autocomplete=“off””，密码输入框添加 autocomplete=“new-password”
如果是整个表单可以设置: <form method=“post” action=" /form" autocomplete=“off”
登录界面时，输入账号会出现历史记录

当你选中时会出现样式，会导致样式看起来特别怪


下面是解决办法：

// 输入框历史记录样式
input:-webkit-autofill {
  // 选中历史记录输入框背景颜色 box-shadow
  -webkit-box-shadow: 0 0 0px 1000px transparent inset !important;
  box-shadow: 0 0 0px 1000px transparent inset !important;
  // 背景颜色
  background-color: rgb(59,90,131) !important;
  // 切换动画;时间设置久一点就可以变成透明色，与背景颜色一样，时间不要设置太短
  -webkit-transition: background-color 60000s ease-in-out 0s!important;
  transition: background-color 60000s ease-in-out 0s!important;
  // 选中历史记录文字颜色
  -webkit-text-fill-color: #fff;
  // 背景裁剪区域，加上该属性，背景只会显示输入框中的文本
  //-webkit-background-clip: text;
}

如果觉得光标颜色有冲突；也可以进行修改

input{
  caret-color: white; /*光标颜色*/
}

修改完以后就可以正常展示想要的效果