删除3D按效果Internet Explorer按钮 [英] Remove 3D press effect Internet Explorer button

问题描述

我要删除Internet Explorer中按钮上的 3D点击效果（我使用的是IE10）。

I'm trying to remove the 3D click effect on buttons in Internet Explorer (I'm using IE10).

尝试：

button:active {
  position: relative; 
  left: -1px; 
  top: -1px; 
}

但这使整个按钮向左上移动1 px我在寻找）。

我只想让文字保持在相同的位置，即使点击。

But this makes the entire button shifts 1 px top-left (not the behavior I'm looking for).
I want just to make the text stay in the same position even when clicked.

我发现< a href =http://stackoverflow.com/questions/8704736/i-cant-remove-the-pressed-effect-of-buttons-in-internet-explorer-9>这个问题没有好处

这是我到目前为止的代码：

http://codepen.io/anon/pen/aliFb

This is my code so far:
http://codepen.io/anon/pen/aliFb

推荐答案

现在有同样的问题...有点晚了，所以我不知道答案是否仍然适用。

Had the same problem right now... It's a bit late, so I don't know whether the answer would still be applicable.

我的解决方案是将按钮的文本放在 span 元素中，然后设置样式到 transform：translateY（1px）; 。没有更多的不必要的按压效果。我在尝试之前有点担心，因为它会混乱FF，Chrome和Safari的Windows。但奇怪的是，他们似乎忽略它（至少现在至少）。分别在28,27和5.1测试。此外，我使用的是IE 10。

My solution was to put the button's text within a span element then set the style to transform: translateY(1px);. And no more unnecessary press effect. I was a bit apprehensive before trying it, as it would mess with FF, Chrome, and Safari for Windows. But weirdly, they seem to ignore it (for now at least). Tested on 28, 27, and 5.1 respectively. Also, I'm using IE 10.

祝你好运

这篇关于删除3D按效果Internet Explorer按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！