移动端Web开发,ios下 input为圆角

在处理input的问题时，一般不想要input的原来的样式，一般就直接处理

border: none;
outline: none;
background: transparent;

这样之后，一般就可以解决，

但是最近在写一个微信公众号的页面，其中就有用到input，老三件，手机一测ok（本人是安卓机），以为没啥问题呢，

后来同事一测（IOS），就告诉我，input是圆角，且有一条线，

如下图

这是怎么回事呢，马上查资料，

有说这样的

-webkit-appearance: none;
-webkit-appearance: none;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);

改完之后，没有变化

然后又改input的宽高，还是无果

然后，突然看到，有人说，加一句

border-radius: 0;

恩，貌似可以试一下，果然，神奇的解决了，可是我纳闷的是，解决圆角问题也就算了，为什么还能解决线的问题，还在思考，但是记住了一个知识点！！！