input自动填充浏览器记住的密码后,去除输入框背景颜色

旧城等待, 2024-04-17 05:59 139阅读 0赞

谷歌chrome浏览器在用户登录记住密码之后通常会改变input框的背景色

watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQxNzI1NDUw_size_16_color_FFFFFF_t_70

input CSS样式

  1. input:-webkit-autofill , textarea:-webkit-autofill, select:-webkit-autofill {
  2. -webkit-text-fill-color: #ededed !important;
  3. -webkit-box-shadow: 0 0 0px 1000px transparent inset !important;
  4. background-color:transparent;
  5. background-image: none;
  6. transition: background-color 50000s ease-in-out 0s; //背景色透明 生效时长 过渡效果 启用时延迟的时间
  7. }
  8. input {
  9. background-color:transparent;
  10. }

input scss样式

  1. input {
  2. background-color:transparent;
  3. border: 0px;
  4. -webkit-appearance: none;
  5. border-radius: 0px;
  6. padding: 12px 5px 12px 15px;
  7. color: $bg;
  8. height: 47px;
  9. // caret-color: $cursor;
  10. &:-webkit-autofill , textarea:-webkit-autofill, select:-webkit-autofill {
  11. -webkit-text-fill-color: $bg !important;
  12. -webkit-box-shadow: 0 0 0px 1000px transparent inset !important;
  13. background-color:transparent;
  14. background-image: none;
  15. transition: background-color 50000s ease-in-out 0s; //背景色透明 生效时长 过渡效果 启用时延迟的时间
  16. }
  17. }

发表评论

表情:
评论列表 (有 0 条评论,139人围观)

还没有评论,来说两句吧...

相关阅读