问题描述:input表单添加了背景图片,结果自动填充是,编程了一个淡黄色矩形方框。

解决方案:网上查询了很多的解决方式,基本都不管用,这里我简单说两个。

1.去除黄色背景

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

  outline:none;  //去除焦点边框

2.修改readonly属性:

  <input type="password" readonly onfocus="this.removeAttribute('readonly');"/>

3.借鉴网易163的,可以在不需要默认填写的input框中设置 autocomplete="new-password"

感觉这种学习思路对前端学习很有启发性,遇到问题在网上查询了很多还是解决不了时,可以去网上看看类似的功能别人是如何实现的,而不是一味地的采纳网上天花乱坠的说法。

chrome浏览器默认样式覆盖input背景的更多相关文章

  1. Chrome 浏览器默认样式覆盖自己 CSS 样式的解决

    检查 HTML 源代码,DOCTYPE 的声明是否写正确. HTML5 的 DOCTYPE 声明规范: <!DOCTYPE html> 参考链接: css - User agent sty ...

  2. 浏览器默认样式及reset

    写在前面 首先纠正一个易错概念.div并非生来就是块元素,而是每个浏览器都有一套默认的css样式(优先级最低),默认样式里会把div设置成display: block;还有margin,padding ...

  3. css知多少(4)——解读浏览器默认样式

    上一节<css知多少(3)——样式来源与层叠规则>介绍了样式的五种来源,咱们再通过一张图回顾一下. 对于上面的三层,咱们大概都比较熟悉了.下面的两层中,用户自定义样式一般也就是改一改字号大 ...

  4. 浏览器默认样式(user agent stylesheet)+cssreset

    每种浏览器都有一套默认的样式表,即user agent stylesheet,在写网页时,没有指定的样式,按浏览器内置的样式表来渲染.这是合理的,像word中也有一些预留样式,可以让我们的排版更美观整 ...

  5. 浏览器默认样式(User Agent Stylesheet)

    原文:http://www.zjgsq.com/898.html 不同浏览器对于相同元素的默认样式并不一致,这也是为什么我们在CSS的最开始要写 * {padding:0;marging:0}: 不过 ...

  6. css 框架——base.css,作用是重设浏览器默认样式和提供通用原子类。自己留存

    今天发下我自己的 css 框架——base.css,作用是重设浏览器默认样式和提供通用原子类. @charset "utf-8"; /*! * @名称:base.css * @功能 ...

  7. css知多少(4)——解读浏览器默认样式(转)

    css知多少(4)——解读浏览器默认样式   上一节<css知多少(3)——样式来源与层叠规则>介绍了样式的五种来源,咱们再通过一张图回顾一下. 对于上面的三层,咱们大概都比较熟悉了.下面 ...

  8. CSS3初学篇章_7(布局/浏览器默认样式重置)

    CSS布局说到布局,就不得不提布局的核心<div>标签,它与其它标签一样,也是一个XHTML所支持的标签,专门用于布局设计的容器标签.在css布局方式中,div 是这种布局方式的核心对象, ...

  9. 去掉user agent stylesheet 浏览器默认样式 [ 2.0 版本 ]

    今天在写一个网页的时候发现一个问题,我的table的样式很奇怪,也没有设置什么样式,跟其他的页面不一样,打开开发者工具一看,发现有这么点样式: 其中右上角:user agent stylesheet ...

随机推荐

  1. Poco C++库网络模块例子解析2-------HttpServer

    //下面程序取自 Poco 库的Net模块例子----HTTPServer 下面开始解析代码 #include "Poco/Net/HTTPServer.h" //继承自TCPSe ...

  2. [Form builder]:about SYSTEM.MESSAGE_LEVEL

    If you want to suppress error messages then you have to set a system variable :system.message_level. ...

  3. RedHat6.1(64bit)安装JDK

    今天在服务器上装JDK1.5,费了不少力气,记录下来以供参考 服务器安装的操作系统为Red Hat 6.1(x86) [123@123 bin]$ cat /etc/redhat-release Re ...

  4. 清除Eclipse和Myeclipse中的工作空间目录

    打开Eclipse或者Myeclipse后,选择功能菜单里的Windows->Preferences->, 弹出对话框后,选择General->Startup and Shutdow ...

  5. 【S】【S】【S】一大波前端干货整合(一)

      前端交流站点 大前端       http://www.daqianduan.com/ V2EX       http://www.v2ex.com/ W3cplus    http://www. ...

  6. Hibernate缓存杂谈

    1.什么是缓存? 缓存是介于物理数据源与应用程序之间,是对数据库中的数据复制一份临时放在内存中的容器,其作用是为了减少应用程序对物理数据源访问的次数,从而提高了应用程序的运行性能.Hibernate在 ...

  7. andorid 平台调用Web Service , 图片传输

    今天学习了下android调用web service,进行图片传输 下面是代码详解: onActivityResult 方法在图片剪裁完成之后调用: protected void onActivity ...

  8. C++学习笔记3—对话框

    1.模态对话框 CTipDlg tipDlg; INT_PTR nResponse = tipDlg.DoModal(); if(nResponse == IDCANCEL) {  return; } ...

  9. 关于arcgis 9.3破解问题详解

    对于初学GIS的同学,安装软件可能会遇到各种各样的问题,对于photoshop,autocad,sketchup,3dmax等软件我们的我们无非是输入特定序列号或者用工具随机生成特定序列号就可以破解, ...

  10. bzoj1402:[HAOI2008]硬币购物

    思路:完全背包加容斥原理 首先不考虑限制,那么很容易可以预处理出f[i](f[i]+=f[i-c[i]],1<=i<=4,i-c[i]>=0). 然后考虑如何求出限制后的答案. 首先 ...