任何方式来移除活动表单中提交button的IE黑色边框？
我正在实现一个使用自定义风格的提交button的devise。 他们是相当简单的浅灰色的button，有一个稍深的外边框：
input.button { background: #eee; border: 1px solid #ccc; } 这看起来恰到好处在Firefox，Safari和Opera。 问题是与Internet Explorer，6和7。
由于表单是页面上的第一个表单，因此它被视为主表单，并因此从主动forms开始生效。 在活动表单中的第一个提交button在IE中收到一个纯黑色边框，将其标记为主要操作。
如果我closures边界，那么IE中的黑色额外边框也会消失。 我正在寻找一种方法来保持我的正常边界，但删除轮廓。
那么这个作品在这里：
<html> <head> <style type="text/css"> span.button { background: #eee; border: 1px solid #ccc; } span.button input { background:none; border:0; margin:0; padding:0; } </style> </head> <body> <span class="button"><input type="button" name="..." value="Button"/></span> </body> </html>
如果你不想添加包装到input/button然后尝试这样做。 由于这是无效的CSS，所以只能用于IE浏览器。 有其他浏览器的边框，但使用filter：IE的色度…
<!--[if IE]> <style type="text/css"> input { filter:chroma(color=#000000); border:none; } </style> <![endif]-->
为我工作。
我知道我比赛迟到了将近2年，但是我发现了另一个解决scheme（至less对于IE7来说）。
如果在表单中的任何其他提交button之前添加其他input type="submit" ，问题将消失。 现在你只需要隐藏这个新的黑色边框吸收button。
这适用于我（溢出需要是“自动”）：
<input type="submit" value="" style="height:0;overflow:auto;position:absolute;left:-9999px;" />
注意：我正在使用HTML5文档types（ <!doctype html> ）。
我在另一个论坛上find了适合我的答案。 它将删除ie6和ie7中不需要的黑色边框。 很可能有一些/你们没有在表单标签中定位你的input=“提交”。 不要忽略这一点。 它尝试了一切后，为我工作。
如果您正在使用提交button，请确保它位于表单中而不仅仅是一个字段集：
<form><fieldset><input type="submit"></fieldset></form>
我能够将David Murdoch的build议与一些JQuery结合起来，这样修复将自动应用于页面上的所有“input：submit”元素：
// Test for IE7. if ($.browser.msie && parseInt($.browser.version, 10) == 7) { $('<input type="submit" value="" style="height:0;overflow:auto;position:absolute;left:-9999px;" />') .insertBefore("input:submit"); }
您可以将其包含在母版页或同等资源中，以便将其应用于您网站中的所有页面。
它有效，但是不知何故，它确实感觉有点不对劲。
我build立在@ nickmorss的使用filter的例子，并没有真正解决我的情况…使用辉光filter，而不是我的工作更好。
<!--[if IE]> <style type="text/css"> input[type="submit"], input[type="button"], button { border: none !important; filter: progid:DXImageTransform.Microsoft.glow(color=#d0d0d0,strength=1); height: 24px; /* I had to adjust the height from the original value */ } </style> <![endif]-->
对了，这里是一个丑陋的解决scheme，让你去衡量…将button放在一个<span> ，button上的边框，并将边框改为跨度。
IE浏览器对于表单元素页边距有点不太确定，所以这可能无法正确工作。 也许给这个跨度与button的背景相同可能会有所帮助。
span.button { background: #eee; border: 1px solid #ccc; } span.button input { background: #eee; border:0; }
和
<span class="button"><input type="button" name="..." value="Button"/></span>
我发现的最佳解决scheme是将边框移动到一个包装元素，如下所示：
<div class='submit_button'><input type="submit" class="button"></div>
有了这个CSS：
.submit_button { width: 150px; border: 1px solid #ccc; } .submit_button .button { width: 150px; border: none; }
这个解决scheme的主要问题是，button现在是一个块元素，并需要固定宽度。 除了Firefox2不支持，我们可以使用内联块。
欢迎任何更好的解决scheme。
我认为filter：色度（颜色=＃000000）; 因为你可以在某个class级申请，所以最好的是最好的。 否则，如果您正在使用课程，则必须在每个button上应用额外的标记。
.buttonStyle {filter：chroma（color =＃000000）; 背景颜色：＃E5813C固体; BORDER-BOTTOM：#cccccc 1px solid; BORDER-LEFT：#cccccc 1px solid; BORDER-RIGHT：#cccccc 1px solid; BORDER-TOP：#cccccc 1px solid; COLOR：＃FF9900; FONT-FAMILY：Verdana，Arial，Helvetica，sans-serif; 字体大小：10px; 字体：粗体; 文本 – 装饰：无; 这是为我做的！
我有这个问题，解决了它与button周围的div，显示为一个块，并手动定位。 IE和FF的button边缘太不可预测了，他们俩都没有办法开心。 我的提交button必须完美地与inputalignment，所以它不会将项目定位为块。
这是行得通的：
input[type=button] { filter:chroma(color=#000000); }
这甚至与button标签，最终你可以安全地使用background-image css属性。
一个骇人的解决办法可能是使用这样的标记：
<button><span>Go</span></button>
并将您的边框样式应用到span元素。
添加*边框：没有这会删除IE6和IE7的边框，但保留为其他浏览器
使用滑动门技术，在button内使用两个spans 。 并消除您的IE覆盖button上的任何格式。
<button><span class="open">Search<span class="close"></span></span></button>
我不能评论（还），所以我必须添加我的评论这种方式。 我想大卫·默多克先生的build议是最好的歌剧（ 在这里 ）。 OMG，他是个多么可爱的女孩。
我已经在Opera中尝试了他的方法，并且我成功地以这种方式使input标签翻倍：
<input type="submit" value="Go" style="display:none;" id="WorkaroundForOperaInputFocusBorderBug" /> <input type="submit" value="Go" />
这样第一个元素被隐藏起来，但是它会占用Opera将显示的焦点，而不是第二个input元素。 爱它！
至less在IE7中，您可以设置边框样式，但不能将其删除（将其设置为无）。 因此，将边框的颜色设置为与背景相同的颜色。
.submitbutton { background-color: #fff; border: #fff dotted 1px; }
如果你的背景是白色的。
这个问题的正确答案是：
outline: none;
…在IE和Chrome上工作，据我所知。
对我来说，下面的代码实际上工作。
<!--[if IE]> <style type="text/css"> input[type=submit],input[type=reset],input[type=button] { filter:chroma(color=#000000); color:#010101; } </style> <![endif]-->
从@Mark's 答案得到它，并只加载了IE浏览器。
