chrome浏览器input的自动完成,点击之后自动输入,input的背景会变成香蕉黄,用如下方法修复:

/* Change the white to any color ;)
就是给input设置内置阴影!而且一定要大,至少要比你的input本身大,不过,box-shadow是很慢的,
而且,如果你的input是用图片做背景的话,是没有办法做这么干的*/
input:-webkit-autofill {
-webkit-box-shadow: 0 0 0 100px white inset;
}
/* Additionally, you can use this to change the text color: */
-webkit-text-fill-color: yellow !important;

或者

/* Change Autocomplete styles in Chrome*/
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus
input:-webkit-autofill,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
border: 1px solid green;
-webkit-text-fill-color: green;
-webkit-box-shadow: 0 0 0px 1000px #000 inset;
transition: background-color 5000s ease-in-out 0s;
}

或者直接关闭chrome的自动完成

<input type="text" autocomplete="off">

<form autocomplete="off"></form>

参考:https://stackoverflow.com/questions/2781549/removing-input-background-colour-for-chrome-autocomplete
           https://css-tricks.com/snippets/css/change-autocomplete-styles-webkit-browsers/

关闭chrome浏览器的input香蕉黄背景的更多相关文章

  1. 取消chrome浏览器下input和textarea的默认样式;html5默认input内容清除“×”按钮去除办法

    取消chrome浏览器下input和textarea的默认样式: outline:none;/*清空chrome中input的外边框*/ html5默认input内容清除“×”按钮去除办法: inpu ...

  2. 一个解决chrome浏览器下input标签当autocomplete的时候背景变黄色同时input背景图片消失方案

    最近在改一个bug即如标题所讲的一样,chrome浏览器下当input标签开启autocomplete的时候input的背景颜色变黄同时在input的背景图片也被覆盖了.为此百度了好久发现网上说的使用 ...

  3. 取消chrome浏览器下input和textarea的默认样式

    最近一个细节引起了我的注意,chrome浏览器下的input和textarea在聚焦的时候都有一个黄色的边框,而且textarea还可以任意拖动放大,这是不能容忍的,影响美观不说,有时候拖动texta ...

  4. 去掉chrome浏览器中input获得焦点时的带颜色边框呢

    可以设置表单控件的outline属性为none值, 来去掉Chrome浏览器中输入框以及其它表单控件获得焦点时的带颜色边框. css代码如下: input{outline:none}

  5. 去掉chrome浏览器中input或textarea在得到焦点时出现黄色边框的方法

    此文来源网络,我转载的原文里的图显示“该图片仅限百度用户内部交流使用”,我估计这篇文章是从百度空间抄过来的,该作者没保留原文地址.所以我在这里也没保留抄袭文章的地址. chrome浏览器不管对于开发者 ...

  6. [转]关闭 Chrome 浏览器的启动时提示 - 请停用以开发者模式运行的扩展程序

    最新版本 69.0.3497.92 (x64) 解决办法: https://www.cnblogs.com/liuxianan/p/disable-chrome-extension-warning.h ...

  7. 关闭Chrome浏览器的广告

    生活没有绝对的对与错:代码就不一样了,错了就编译不过,也正是因为这样,编程的人思维有时也会陷入一种狭隘中,这就是把工作和生活没有分开.Win10 右下角的广告就像程序调试中的"警告" ...

  8. 关闭chrome浏览器的developer tools

    背景 Chrome使用过程中,很容易启动Chrome developer tools,一些误触如按到F12.CTRL+Shift+C等都会启动developer tools.对于不开发Web的人来说, ...

  9. 苹果手机Chrome浏览器显示input:disabled时字体颜色总是为浅灰色

    今天被测试人员提了个bug:苹果手机浏览器(Chrome)打开h5,控件在input:disabled的样式始终是浅灰色,要求改成黑色.测试对比:1.在多个pc浏览器上浏览input:disabled ...

随机推荐

  1. Where do I belong-freecodecamp算法题目

    Where do I belong(数组排序并找出元素索引) 要求 给数组排序 找到指定的值在数组的位置,并返回位置对应的索引. 思路 设定.sort()需要的返回函数 将要搜索的值添加到数组内 用. ...

  2. dev gridview columns代码管理

    进入run designer界面.我们将在代码中设置columns的属性. 类: ViewTriAtt : DevExpress.XtraEditors.XtraUserControl 在类里面设置g ...

  3. 转 消息队列之 RabbitMQ

    转 https://www.jianshu.com/p/79ca08116d57 消息队列之 RabbitMQ 预流 2017.05.06 16:03* 字数 4884 阅读 80990评论 18喜欢 ...

  4. pandas中的随机排序和抽样

    1.随机重排序 使用take()随机排序 如: df.take([54])   #采取索引为54的数据 可以借助np.random.permutation()函数随机排序 permutation()函 ...

  5. Unity基础-发布

    PC BuildSetting File->BuildSetting Switch Platform Development Build是在调试模式下使用版本 Script Debugging调 ...

  6. How to Install Zabbix Server on Centos6.7

    Prerequisite Environment First you must use your Subscription Manager to enable SCL: [root@fileserve ...

  7. destoon 数据库操作

    1.插入数据 $db->query("INSERT INTO ".get_table($mid)." ($sqlk) VALUES ($sqlv)");  ...

  8. 【windows】win7 sp1 系统语言中英文切换

    注:Windows 7 Ultimate and Windows 7 Enterprise (旗舰版和企业版) 可以直接在控制面板/地区和语言中修改显示语言,其他系统不行 进入网站下载相关的MUI包安 ...

  9. Python学习笔记:面向对象(类)

    1.类定义:Python3中,如果新建的类没有继承任何其他类,默认继承基础类object.Python2中如果没有显式继承object类就是经典类,而显式继承了object类就是新式类,Python2 ...

  10. ubuntu gcc的下载链接,比较快的。

    http://mirrors.163.com/ubuntu-releases/ http://xhmikosr.1f0.de/tools/msys/