使用chrome浏览器选择记住密码的账号,输入框会自动加上黄色的背景,有些设计输入框是透明背景的,需要去除掉这个黄色的背景;

方法1:阴影覆盖

input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px white inset !important;
}
   

由于是设置颜色覆盖,所以只对非透明的纯色背景有效

方法2:修改chrome浏览器渲染黄色背景的时间

:-webkit-autofill {
 -webkit-text-fill-color: #fff !important;
 transition: background-color 5000s ease-in-out 0s;
}
   

完美解决

2、input 获取焦点后,清除默认蓝色边框,添加css属性

outline:none;

chorme 浏览器记住密码后input黄色背景处理方法(两种)的更多相关文章

  1. chorme浏览器记住密码后input黄色背景处理方法总结(三种)

    问题分析 正常情况: 记住密码后访问: 解决方法 方法1:阴影覆盖input:-webkit-autofill { -webkit-box-shadow: 0 0 0 1000px white ins ...

  2. chorme 浏览器记住密码后input黄色背景处理

    使用chrome浏览器选择记住密码的账号,输入框会自动加上黄色的背景,有些设计输入框是透明背景的,需要去除掉这个黄色的背景: 方法1:阴影覆盖 input:-webkit-autofill { -we ...

  3. Chrome浏览器记住密码后input框黄色背景且背景图片不显示的问题

    Chrome浏览器记住密码后再进入登录页后,输入框背景颜色变为黄色,字体颜色变成#000黑色,且添加的背景图片也那不显示了,进入审查元素后,发现浏览器默认给输入框添加了样式,并且无法通过importa ...

  4. react中密码自动填充及解决火狐浏览器,360浏览器记住密码后,密码框自动填充终极解决方案

    先直接上核心代码如下: 在火狐浏览器,360浏览器,初次加载,bug长这样: 如果你想通过生命周期componentDidMounted等生命周期进行置空操作都是不行的,这可能是浏览器自带的特性记住密 ...

  5. 记住密码后,密码框Password会自动带出数据

    一般登陆之后浏览器会询问是否记住密码,如果把密码记住在浏览器上,下次登陆的时候浏览器会把用户名和密码自动填充到登录页面.前段时间服务站平台的员工账号模块提测后,测试提出360浏览器记住密码后会自用把登 ...

  6. Vue单页面应用阻止浏览器记住密码

    Vue单页面应用阻止浏览器记住密码 ——IT唐伯虎 摘要: Vue单页面应用阻止浏览器记住密码. 现象1:路由切换时再次提示“是否记住密码” 登录页面有个密码输入框,输入账号密码进行登录: 登录完成后 ...

  7. CSS实现自适应不同大小屏幕的背景大图的两种方法(转自简书)

    CSS实现自适应不同大小屏幕的背景大图的两种方法 一张清晰漂亮的背景图片能给网页加分不少,设计师也经常会给页面的背景使用大图,我们既不想图片因为不同分辨率图片变形,也不希望当在大屏的情况下,背景有一块 ...

  8. HTML中设置背景图的两种方式

    HTML中设置背景图的两种方式 1.background    background:url(images/search.png) no-repeat top; 2.background-image ...

  9. springboot项目启动成功后执行一段代码的两种方式

    springboot项目启动成功后执行一段代码的两种方式 实现ApplicationRunner接口 package com.lnjecit.lifecycle; import org.springf ...

随机推荐

  1. TypeScript学习笔记(三) - 方法

    本篇将介绍在TypeScript里如何定义和使用方法. 一.方法标准声明和使用 // 方法声明 function func(x: number, y: number): number { return ...

  2. wiremock docker 运行

    使用docker 模式 docker-compose yaml version: '3.3' services: service1: image: rodolpheche/wiremock ports ...

  3. SQL优化之索引分析

    索引的重要性 数据库性能优化中索引绝对是一个重量级的因素,可以说,索引使用不当,其它优化措施将毫无意义. 聚簇索引(Clustered Index)和非聚簇索引 (Non- Clustered Ind ...

  4. JAVA面向对象编程课程设计——web版斗地主

    一.团队课程设计博客链接 JAVA面向对象编程课程设计--网络版单机斗地主 二.个人负责模块或任务说明 实体类的设计 斗地主规则的实现 人机自动出牌的算法 实现数据库的DAO模式 三.自己的代码提交记 ...

  5. Splunk安装部署基础篇

    Splunk安装(以4.3.4版本为例) 下载splunk软件包,并解压,直接启动即可. --Linux-x86_64.tgz -C /optcd /opt/splunk/bin./splunk st ...

  6. rpc简易实现-zookeeper

    一.RPC(Remote Procedure Call)—远程过程调用,它是一种通过网络从远程计算机程序上请求服务,而不需要了解底层网络技术的协议.RPC协议假定某些传输协议的存在,如TCP或UDP, ...

  7. cookies封装

    /** * @author wxf */var cookie=new function(){ this.set=function(name,value,hours){ var life=new Dat ...

  8. Python-第三方库requests

    Requests 是使用 Apache2 Licensed 许可证的 基于Python开发的HTTP 库,其在Python内置模块的基础上进行了高度的封装,从而使得Pythoner进行网络请求时,变得 ...

  9. Java里的堆(heap)栈(stack)和方法区(method)

    基础数据类型直接在栈空间分配, 方法的形式参数,直接在栈空间分配,当方法调用完成后从栈空间回收.   引用数据类型,需要用new来创建,既在栈空间分配一个地址空间,又在堆空间分配对象的类变量 . 方法 ...

  10. (网页的缓存控制)HTML配置no-cache(备忘) “Cache-control”常见的取值

    HTML配置no-cache(备忘) No-cache配置 html表头如下 <meta http-equiv="Content-Type" content="te ...