如何使按钮在css中的所有设备上看起来相同？

我正在一个网站上工作，我希望搜索按钮在所有移动设备和平板设备上看起来都一样。我已经为此创建了一个新的应用程序。我用于搜索按钮的代码是：

@仅媒体屏幕和（最大宽度：767px）{
#gv_搜索按钮_2777{
左：5.5%；
垫面：0.5%；
垫底：0.5%；
右侧填充：5.5%；
背景色：白色；
字体大小：12px；
边界半径：3.5px；
边框：1px实心#ccc！重要；
}
}

---

您可以设置

外观：无

告诉iOS Safari（和其他人）不要对元素应用OS本机样式：

.button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

---

从那里，您可以重置浏览器样式表属性（例如边距、填充、字体等），并应用您自己的自定义样式。

我不知道为什么这个问题被选为非编程问题。我想知道我需要在CSS代码中做些什么更改，以便我能够在所有设备上获得附加的屏幕截图。在我的手机上，它看起来完全一样。你有什么样的手机，你能在手机上看到什么吗？@MaximillianLaumeister Iphone。可能是iphone的问题吗？可能吧。您可能需要将问题标记为

mobileSafari

，并相应地编辑您的问题陈述。@MaximillianLaumeister在chrome和safari上都打开了。它看起来很圆。检查我的问题陈述。像这样的东西现在看起来不错了。@john注意到级联样式表规则级联。通过将

appearance:none

放置在具有相同选择器特定性级别的其他样式之后，您可能最终会覆盖已设置的某些样式。更新：您已经三次使用了

外观：none

。错误，否。这些是供应商前缀。唉，这不是一个解释CSS整体的好媒介。值得一提的是，我引用了外观属性声明在其他样式之后的位置，而不是像我建议的那样使用这三个属性。研究一下你的小提琴v7和v8的区别。@coreyard是的，我现在知道了。谢谢你让我知道。我已经接受了你的回答。