CSS - 按钮的背景颜色'在移动设备上不会改变

Question

左边的是计算机，右边是移动设备。 我不希望手机上有渐变背景或圆边。

input {
    margin: 0px;
    font-size: 20px;
    border: 0px;
    background: green;
    color: lime;
    height: 40px;
    width: 123px;
    padding: 0px;
}

Answer 1

您可以将属性“-webkit-appearance”设置为“none”：

input {
    -webkit-appearance: none;
}

Answer 2

我知道在iPhone和其他使用safari的苹果产品等移动设备上有不同的输入格式，包括圆形边缘。最简单的方法是使用onclick函数创建图像。像这样，或者onmouseover悬停效果。

<script>
function myfunction(){

}
</script>

<img src="picture.png" onclick="myfunction();" onmouseover="this.src='image2.gif'" />