从按钮删除边框

Question

我试图创建按钮并插入我自己的图像而不是标准按钮图像.但是,标准按钮的灰色边框仍然保留,显示在我的黑色按钮图像的外部.

有谁知道如何从按钮中删除这个灰色边框,所以它只是图像本身？谢谢.

Answer 1

加

padding: 0;
border: none;
background: none;

到你的按钮.

演示:

Answer 2

这似乎对我很有用.

button:focus { outline: none; }

`outline:none;`出于可访问性原因,不建议使用`.如果您必须删除焦点边框,请提供另一种方式让用户看到它具有焦点.http://outlinenone.com/ (4认同)

Answer 3

input[type="button"] {
border: none;
outline:none;
}

Answer 4

您可以轻松地为其赋予这种样式：

MyButton {
border: none;
outline: none;
background: none;
}

它border: none;还会单独为您完成这项工作，而不给出轮廓（因为：轮廓是在元素边框之外绘制的线。因此，当没有边框时，轮廓属性本身没有任何意义）。

背景速记 CSS 属性一次设置所有背景样式属性，例如颜色、图像、原点和大小或重复方法。因此，当您将其值设置为时none，它会阻止您的按钮具有任何颜色、图像等......

Answer 5

我遇到了同样的问题,即使我在CSS中设置我的按钮样式它也永远不会拿起border:none但是有效的是直接在输入按钮上添加一个样式,如下所示:

<div style="text-align:center;">
    <input type="submit" class="SubmitButtonClass" style="border:none;" value="" />
</div>

Answer 6

从按钮焦点上的按钮中删除默认的“蓝色边框”：

在 HTML 中：

<button class="new-button">New Button...</button>

而在 CSS 中

button.new-button:focus {
    outline: none;
}

希望能帮助到你：）