在Safari和Chrome中提交图片边框？

Question

我有一个提交图片按钮：

 <input id="sbutton" type="image" value="&nbsp;" />   

风格如下：

#sbutton {
    text-indent: -99999px;
    border: 0;
    background-image: url('submit.png'); 
    width: 201px;
    height: 37px;
}

它在Firefox的Opera中完美无缺，按钮大小约为10x10px，在Safari和Chrome中它有一些奇怪的边框（如iframes有），我不知道如何获取摆脱那个？

谢谢：）

Answer 1

这可能是一个大纲吗？设置：

 #sbutton:active,
 #sbutton:focus
 {
  outline: none;
 }

尝试一下。

Answer 2

我在CSS中使用背景图片时，从图像更改了类型以提交，这解决了我的问题。

Answer 3

尝试：

border:none;

而不是：

border:0;

Answer 4

对于这个问题，这是一个正确的解决方案：

:active, :focus { outline: none; }

Answer 5

显然，对于没有src属性的图像输入会发生这种情况。你可以给它一个src，如下文所示：

input type="image" shows unwanted border in Chrome and broken link in IE7

或者，如果你正在设置背景图像，你可以使用type =“submit”输入而不是type =“image”。