谷歌浏览器默认样式的修改

1.Chrome自动填充的input背景为黄色:

box-shadow 向框添加阴影,默认是在框外面,inset改为向内添加。

box-shadow :H水平偏移量 V垂直偏移量 B模糊尺寸 S阴影尺寸 C阴影颜色 O/I内外影;

看阴影效果,先确定阴影尺寸,再确定偏移距离。

input:-webkit-autofill {  
    -webkit-box-shadow: 0 0 0px 100px white inset !important;  //不能为transparent的任意颜色,利用内部阴影遮住浏览器默认的黄色背景
   box-shadow: 0 0 0px 100px white inset !important;
} 

2.input获得焦点时的蓝色边框

  利用元素的轮廓属性(不占长宽空间),outline: none;即可。

以上皆为个人理解,如有错误之处,欢迎留言指正。
原文地址:https://www.cnblogs.com/kevin2chen/p/6409695.html