谷歌浏览器默认样式的修改
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;即可。
以上皆为个人理解,如有错误之处,欢迎留言指正。