问题描述: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. 打造强大的BaseModel(2):让Model实现自动映射,将字典转化成Model

    打造强大的BaseModel(1):让Model自我描述 这篇文章将讲述Model一项更高级也最常用的功能,让Model实现自动映射–将字典转化成Model(所有代码全由Swift实现) 将JSON转 ...

  2. chrome浏览器频频崩溃,如何解决?

    之前chrome常崩溃,也没有找到原因,就将就着用吧,一直用到今天, 今天连续几次崩了,突然想到,难道是因为我访问的域名没有解析(能想到这个,是因为今天分配公司域名测试的时候常输错),于是就输入一个不 ...

  3. Asp.Net分页存储过程

      SQL分页语句 一.比较万能的分页: sql代码: 1 2 3 select top 每页显示的记录数 * from topic where id not in  (select top (当前的 ...

  4. find which process occupy the PORT

    mac :   lsof -i:8080 linux : netstat -anltp | grep 8080

  5. iframe父子窗口取值

    父窗口中操作iframe:window.frames["iframeChild"].document //假如iframe的id为iframeChild 在子窗口中操作父窗口:wi ...

  6. JS实现各种页面的刷新

    JS实现各种页面的刷新功能 1.刷新当前页面 opener.location.replace(opener.location.href); 或者window.opener.window.locatio ...

  7. Object-C内存管理

    Object-C的内存管理是基于引用计数的.你要做的事情只是关注你的引用,而释放内存的工作实际上由运行环境完成. 在最简单的情形中,你分配(alloc)的对象,或只是保留(retain)在一些地方的对 ...

  8. JAVA学习-JAVA环境准备

    dir:列出当前目录下的文件以及文件夹md:  创建目录rd:  删除目录cd: 进入指定的目录,打开文件夹cd..:退回到上一级目录cd/或cd\:退回到根目录del:删除文件d: : 切换到D盘根 ...

  9. 设置contentType

    //定义编码 header( 'Content-Type:text/html;charset=utf-8 '); //Atom header('Content-type: application/at ...

  10. Dao模型设计(基于Dao与Hebernate框架)

    以前没有Dao设计模型之前,一般都是这样的流程: ①先设计实体对象 学生对象: package com.itheima.domain; import java.io.Serializable; imp ...