iOS html5 css3 按钮点击样式答案

【问题标题】：iOS html5 css3 button click styleiOS html5 css3 按钮点击样式
【发布时间】：2012-03-16 01:26:32
【问题描述】：

我在 HTML5/CSS3/JavaScript 上编写我的应用程序。对于我的按钮，我创建了样式（在浏览器中都可以正常工作），但是当我在 iPad 上启动我的应用程序时，我的活动效果会覆盖标准的 iOS 点击效果。如何覆盖这种标准效果？

我的风格：

<style type="text/css">    
.button {
display: inline-block;
width: 150px;
height: 50px;
background: #f78d1d;
background: -webkit-gradient(linear, left top, left bottom, from(#faa51a), to(#f47a20));
background: -moz-linear-gradient(top,  #faa51a,  #f47a20);
filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#faa51a', endColorstr='#f47a20');
}

.button:ACTIVE {
background: #f47c20;
background: -webkit-gradient(linear, left top, left bottom, from(#f88e11), to(#f06015) );
background: -moz-linear-gradient(top, #f88e11, #f06015);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f88e11', endColorstr='#f06015' );
}

我的按钮：

<a href="#" class="button"></a>

【问题讨论】：

标签： ios html css

【解决方案1】：

我相信你的问题的答案很简单。

将以下 CSS 代码添加到您的按钮或正文标签（以影响整个文档）。

body { -webkit-appearance: none; }

这将删除 iOS 放置在某些 UI 元素上的按钮的默认样式。

希望对您有所帮助。

【讨论】：

【解决方案2】：

我在使用按钮标签时遇到了同样的问题，它似乎被覆盖了。

<button class="button"><a href="#go">Link</a></button>

【讨论】：