输入按钮删除＆＃34;阴影＆＃34;

Question

我无法删除灰色＆＃34;阴影＆＃34;输入类型按钮对其中一半的影响：

我检查了论坛上的所有方法，但是：

-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
box-shadow: none;
outline: white;

不起作用......

Excample：

＆＃13;

＆＃13;

.background {
  background-color: lightgrey;
  width: 400px;
  height: 300px;
}

.button {
  position: absolute;
  left: 10px;
  top: 10px;
  background-color: black;
  border-radius: 50%;
  border-width: 2px;
  border-color: white;
  width: 25px;
  height: 25px;
  color: white;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  box-shadow: none;
  outline: white;
}

.box {
  position: absolute;
  left: 20px;
  top: 20px;
  background-color: white;
  width: 200px;
  height: 100px;
}

＆＃13;

<div class="background">
<div class="box">
</div>
<input type="button" class="button" value="x">
</div>

＆＃13;

＆＃13;

＆＃13;

论坛发帖系统迫使我写更多内容，因为我在帖子中有很多代码行。但我不知道我还能写些什么？ Everthing在图像和上面的代码中。所以我写了这个论坛不喜欢的内容：＆＃34;谢谢你： - ）＆＃34;

Answer 1

这是因为输入类型=“按钮”中的边框样式。

你有灰色阴影的原因是因为它设置为'outset'，将其更改为solid以便将其删除：）

.button {
   background-color: black;
   border-radius: 50%;
   border-width: 2px;
   border-color: white;
   border-style: solid;
}

Answer 2

将您的border-color更改为transparent以删除任何颜色，并使您的边框因border-width属性

而采用背景颜色

.button {
  background-color: black;
  border-radius: 50%;
  border-width: 2px;
  border-color: transparent; /* NEW */
}