Question

在我的Wordpress网站开发中使用联系表单7，我注意到移动设备的按钮不同，所以在搜索后我找到了我应用于元素-webkit-appearance: none;的{{1}}解决方案。

该样式已应用，因为它在我检查元素时显示，但在移动设备上没有任何变化。

我应该将它应用于其他元素吗？

Answer 1

您应该尝试使用此代码：

. .bash_profile

如果仍然无效，请考虑添加input.wpcf7-form-control.wpcf7-submit { -webkit-appearance: none; -moz-appearance: none; appearance: none; }。

Answer 2

抱歉超级迟到的答案。这堂课似乎确实是正确的。 Temani的答案也是更广泛的浏览器兼容性的一个很好的建议。但是，有时，即使得到像Safari这样的浏览器的支持，使用前缀-webkit-也没有效果。所以，我会给你两个答案：

对于提交输入 - 您的案例 - ，您可以简单地提供所需的背景和边框属性，这将覆盖浏览器默认的css属性。 不需要外观属性。但您可能需要定义按钮的每个状态，包括：active 和：hover
对于复选框和单选按钮，问题的解决方法是使用 visibility：none 并使用隐藏输入：before 和/或：在之后创建一个替代支票或收音机，它还需要 visibility：visible 属性。您可以使用：checked：before 选择器为每个状态应用不同的外观

注意：记住：之前和：与输入相关联的之后只能在Chrome和Safari中使用并且只与属性外观：无

希望这有帮助