请参见以下代码示例：http : //jsfiddle.net/Z2BMK/
Chrome / IE8看起来像这样
Firefox看起来像这样
我的CSS是
button {
padding:0;
background:#080;
color:white;
border:solid 2px;
border-color: #0c0 #030 #030 #0c0;
margin:0;
}
如何更改代码示例以使两个浏览器中的按钮相同？我不想使用基于JavaScript的超链接，因为它们不能与键盘上的空格键一起使用，并且必须具有hrefURL，这不是处理问题的干净方法。
button::-moz-focus-inner { margin: -1px; padding: 0; border-width: 1px; }
border-width的-moz-focus-inner是1px默认的，所以写border-width在代码是多余的，但它使得它更清楚是怎么回事。它也可能对将来的开发有所帮助。为了回答您的问题，border-widthFirefox是造成差异的原因，并且添加margin: -1px的解决方案比我以前的解决方案更兼容。
margin: -1px。这太复杂了。如果出现以下情况，它将中断：1）出现渲染引擎中的错误（发生），2）边框颜色不同，3）放大。为了演示解决方案的潜在问题，我准备了一个小提琴：jsfiddle.net/Z2BMK / 455。请放大并注意出现红色边框。
Answers:
添加：
button::-moz-focus-inner {
padding: 0;
border: 0
}
http://jsfiddle.net/thirtydot/Z2BMK/1/
border为了使按钮在两个浏览器中看起来相同，必须包含上述规则，但是当按钮active在Firefox中时，它也会删除虚线轮廓。许多开发人员摆脱了这个点缀的轮廓，可以选择以更直观的方式替换它。
button{background:/*Something here*/} button:focus{-moz-box-shadow:0 0px 3px #C80;}。这补偿了没有虚线的问题，并赋予了我所追求的浏览器一致性。
input[type="reset"]::-moz-focus-inner, input[type="button"]::-moz-focus-inner, input[type="submit"]::-moz-focus-inner, input[type="file"] > input[type="button"]::-moz-focus-inner
filecss除外）。抱歉，在我尝试执行的页面上肯定有冲突的CSS。谢谢。
要在输入元素上修复它，还添加
input[type="reset"]::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner,
input[type="file"] > input[type="button"]::-moz-focus-inner
简单完美！
input[type="file"] > input[type="button"]::-moz-focus-inner因为您已经添加了input[type="button"]::-moz-focus-inner，这不是多余的吗？或者这不是您的经验吗？你知道吗？
margin: -1px？它以某种方式连接到border: 2px吗？