如何使用 CSS 删除默认按钮边框

Question

我有一个像这样的圆形按钮。

.rock{
height:100px;
width:100px;
border-radius:100px;
border-color:yellow;
border-width:8px;
}

<button class="rock" type='button'>Button</button>

我的问题是，如何删除显示在按钮边框上并在单击时发生变化的奇怪的半色东西。我只希望按钮边框为纯黄色。

Answer 1

将border-style 设置为solid。我认为默认是outset，它给你一个更斜的处理。

.rock {
  height: 100px;
  width: 100px;
  border-radius: 100px;
  border-color: yellow;
  border-width: 8px;
  border-style: solid;
}

<button class="rock" type='button'>Button</button>