CSS 移除默认蓝色边框答案

【问题标题】：CSS remove default blue borderCSS 移除默认蓝色边框
【发布时间】：2013-05-14 23:00:06
【问题描述】：

我有一个包含多个按钮的表单，当有人按下 Enter 键时，我使用 JavaScript 提交第二个按钮。

这很好用，但是如果我在 IE 中打开此表单，第一个按钮会出现一个蓝色边框，告诉用户“这是当您按下 Enter 时将按下的按钮”。

有什么方法可以在不覆盖按钮样式的其余部分的情况下使用 CSS 删除它？

例子：

<button  onclick="javascript:alert('remove');">Remove name</button>

【问题讨论】：

【解决方案1】：

这可能会对您有所帮助。使用以下 CSS 属性：

input, 
input:active, 
input:focus {     
    outline: 0;     
    outline-style: none;     
    outline-width: 0; 
}

【讨论】：

【解决方案2】：

我的解决方案（几个月后）

button:focus {
outline: 0;
box-shadow: none;
}

【讨论】：

【解决方案3】：

#sideToggle:focus, #sideToggle:active{
  outline: 0;     
  outline-style:none;     
  outline-width:0;
}

如果其他人访问该帖子，这解决了我的问题。我单独添加了自己的样式，因为它们确实不是问题的核心。

【讨论】：

【解决方案4】：

认为这应该适用于边框（仅在 PC 上测试过 IE10）：

button { outline: 0; }

想要移除背景（WebKit/Blink 需要）？

添加：

background: none;

需要去掉边框（在 IE10 上也去掉背景）：

border: 0;

【讨论】：

【解决方案5】：

使用此代码：

button {
    border : 0px;
    -moz-border-radius:7px;
    -webkit-border-radius:7px;
     border-radius:7px;
}

【讨论】：

【解决方案6】：

button{border:none; border-radius:4px; -moz-border-radius:4px;}

【讨论】：

【解决方案7】：

只需添加border-radius即可开发按钮外观：

-moz-border-radius:7px;
-webkit-border-radius:7px;
border-radius:7px;

【讨论】：

这也改变了布局，一个问题你是真的尝试你发布的东西还是只是猜测？
我编程 5 年。如果你在解决其他问题的过程中创造了一个新问题，你可以责怪自己的技能，而不是那些给你解决问题的想法的人。
@TouhidRahman 一个建议，请不要将其视为冒犯，但请记住，如果您的答案不符合 OP 要求，或者您的答案看起来很轻松，您可能会得到否定投票。如果您认为不可能完全实现 OP 想要的，请解释为什么不可能（或简单地说“那不可能”），然后给出您的替代方案，以便 OP 至少可以看到您已经尝试过。在其他情况下，您似乎只想成为最快的枪；）
@Arkana 感谢您的建议。但是当你没有犯错并且你是来帮助他的时候有人批评你真的很痛苦。
@TouhidRahman 这并不是要伤害你，但对我来说，你似乎在几分钟内发布了 2 个快速修复，甚至没有阅读整个问题......它明确指出“有没有在不覆盖整个按钮样式的情况下使用 css 删除它的方法？”。对不起，如果我冒犯了你，那不是我发表评论的理由......

【解决方案8】：

使用此代码：

button { border:0;}

【讨论】：