Html 按钮周围有一个奇怪的边框，我怎么才能去掉它？

显然它有很多问题，但我最担心的是蓝色按钮周围的边框

下面是每个按钮的HTML代码

蓝色按钮 灰色按钮

---

如果您想要纯色、单色边框，则：

border-style: solid;

它看起来像是被设置为类似于

inset

或

start

的东西，旨在创建一种准3D效果，即Windows 98风格

如果您根本不想要任何边界，那么：

border: 0;

---

我不确定您到底想要什么，但为什么要包装

边框：无将清除边界

另一方面，在链接内部有一个按钮听起来是多余的。为什么不改为设置链接的样式（并应用
display:inline block；
）


为什么要将
包装在链接标签
a
中？不需要将
按钮
标签与
a
标签一起使用，您只需将
按钮
标签上使用的所有css属性应用于
按钮
标签，使其看起来像这样即可。编辑：米创意找到了一个解决方案。啊，好吧，你根本不想要任何边界。我已经更新了我的答案，这很有效。非常感谢。我以前从未使用过按钮，而且我对任何类型的编程都很陌生。再次感谢。HTML按钮元素有默认的样式（背景和边框），您需要覆盖。您欢迎，我很高兴它有帮助，网上有很多资源可以帮助您更好更快地学习。。还有youtube上的视频
.btn {

  -webkit-border-radius: 28;
  -moz-border-radius: 28;
  border-radius: 28px;
  font-family: Arial;
  color: #ffffff;
  font-size: 14px;
  background: #358cb1;
  padding: 10px 30px 10px 30px;
  text-decoration: none;
  float: left;
  margin-top: 20px;
}

.btn:hover {
  background: #3cb0fd;
  text-decoration: none;
}

.btn2 {
  -webkit-border-radius: 31;
  -moz-border-radius: 31;
  border-radius: 31px;
  font-family: Arial;
  color: #000000;
  font-size: 14px;
  padding: 10px 30px 10px 30px;
  border: solid #000000 1px;
  text-decoration: none;
  float: left;
  margin-top: 20px;
  margin-left: 20px;
}

.btn2:hover {
    background: #acb0b3;
  text-decoration: none;
}

border-style: solid;

border: 0;

<a href="" class="btn">View The Line Up</a>
<a href="" class="btn2">View The Line Up!</a>

<a href="#" class="btn">My button text</a>