html - 从按钮中删除边框

Question

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

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

score 230 · Accepted Answer

添加

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

到您的按钮。

演示：

score 60 · Accepted Answer

60

这似乎对我很有效。

button:focus { outline: none; }

于 2016-01-04T05:31:27.237 回答

score 13 · Accepted Answer

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

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

score 10 · Accepted Answer

10

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

于 2020-10-01T00:13:11.030 回答

score 5 · Accepted Answer

你可以很容易地给它这种风格：

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

也将border: none;在不提供轮廓的情况下单独为您完成工作（因为：轮廓是在元素边框之外绘制的一条线。所以当没有边框时，outline 属性本身没有任何意义）。

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

score 5 · Accepted Answer

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

在 HTML 中：

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

在 CSS 中

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

希望能帮助到你：）

score 4 · Accepted Answer

4

尝试使用：border:0;或border:none;

于 2012-07-16T01:27:58.037 回答

score 2 · Accepted Answer

你也可以试试background:none;border:0px按钮。

css 选择器也是div#yes button{..}and div#no button{..}。希望它有帮助

score 2 · Accepted Answer

2

将此添加为css，

button[type=submit]{border:none;}

于 2020-06-04T05:59:27.350 回答

score 2 · Accepted Answer

2

只需使用： button{border:none; outline:none;}

于 2021-06-13T11:05:15.190 回答

score 1 · Accepted Answer

通常的技巧是使图像本身成为链接而不是按钮的一部分。然后，将“click”事件与自定义处理程序绑定。

Jquery-UI 或 Bootstrap 等框架开箱即用。顺便说一句，使用其中之一可能会大大简化整个应用程序的概念。

score 1 · Accepted Answer

1

您可以像这样在 CSS 样式中定位按钮：

 div button {
    border: none;
 }

于 2021-04-11T00:35:35.923 回答

score -5 · Accepted Answer

-5

$(".myButtonClass").css(["border:none; background-color:white; padding:0"]);

于 2019-03-06T19:40:47.360 回答

13 回答 13