最近公司提供了一个很古老的angular项目迭代,因为之前这个项目只在PC端使用并没有对mobile兼容,导致我现在去兼容mobile端花费了大量的时间,在所有的功能性问题解决完成之后,测试小姐姐甩过来两张截图,为什么ios浏览器上聚焦的时候会有一个蓝色的边框样式!!!!
我记得我处理了边框的默认样式,然后在安卓和iOS真机上排查后发现是ios自带的默认样式,最后在查阅资料之后发现一个方法可以完美解决ios端的控件边框默认样式问题。
正题来了-------我们只需要在我们的css中加入以下代码就可以fix(此处的input替换为对应的控件类名)
.input:focus {
-webkit-appearance: none !important;
outline: none !important;
}