删除HTML按钮/提交的完整样式

时间:2010-03-17 05:36:52

标签: html css internet-explorer button state

有没有办法在Internet Explorer中完全删除按钮的样式?我为我的按钮使用了一个css精灵,一切看起来都不错。

但是当我点击按钮时,它会向顶部移动一点,使它看起来变形。是否有css点击状态或mousedown?我不知道是什么触发了这种状态。

我知道这不是什么大不了的事,但有时这是重要的小事。

7 个答案:

答案 0 :(得分:61)

我认为这提供了一种更彻底的方法:



button, input[type="submit"], input[type="reset"] {
	background: none;
	color: inherit;
	border: none;
	padding: 0;
	font: inherit;
	cursor: pointer;
	outline: inherit;
}

<button>Example</button>
&#13;
&#13;
&#13;

答案 1 :(得分:53)

我假设当你说'点击按钮时,它会移动到顶部'你正在谈论按钮的鼠标按下状态,当你发布时鼠标单击,它返回到正常状态?并且您正在使用以下方法禁用按钮的默认呈现:

input, button, submit { border:none; } 

如果是这样..

就个人而言,我发现你实际上无法停止/覆盖/禁用这个IE原生动作,这导致我稍微改变我的标记以允许这个动作而不影响按钮的整体外观各州。

这是我的最终加价:

<span class="your-button-class">
    <span>
        <input type="Submit" value="View Person">
    </span>
</span>

答案 2 :(得分:8)

尝试从按钮上删除边框:

input, button, submit
{
  border:none;
}

答案 3 :(得分:6)

您的问题是“ Internet Explorer”,但是对于那些对其他浏览器感兴趣的人,您现在可以在按钮上使用all: unset来取消样式设置。

它在IE或Edge 18中不起作用,但在其他任何地方都得到了很好的支持。

button {
  all: unset;
}
<button>check it out</button>

答案 4 :(得分:2)

在引导程序4中最简单。 您可以使用以下类: bg-transparentborder-0

答案 5 :(得分:0)

我认为这是按钮“活动”状态。

答案 6 :(得分:0)

为按钮添加简单的样式

{{1}}