添加 CSS 后，按钮链接停止工作答案

【问题标题】：Button link stopped working after I added CSS添加 CSS 后，按钮链接停止工作
【发布时间】：2020-08-04 21:07:40
【问题描述】：

我为我的一个按钮添加了特殊样式，现在我可以单击该按钮，但它不会转到链接（它应该将您定向到单独标签中的 YouTube 视频）。

#help {
  background-color: cornflowerblue;
  border: 2px solid black;
  color: black;
  padding: 20px 45px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 20px;
  border-radius: 100px;
  transition-duration: 0.4s;
}

#help:hover {
  background-color: skyblue;
  color: grey;
  box-shadow: 0 12px 16px 0 rgba(0, 0, 0, 0.24), 0 17px 50px 0 rgba(0, 0, 0, 0.19);
  opacity: 0.9;
}

.contact {
  color: red;
}

&lt;button id="help" href="https://youtu.be/oHg5SJYRHA0" target="blank"&gt;Get help from a low-paid professional&lt;/button&gt;

请注意，当您单击按钮时，它会根据其周围形成的矩形知道它已被单击，但链接不起作用。

我还是个新手，所以请耐心等待，我可能不明白你第一次要说什么。

【问题讨论】：

标签： html css button hyperlink youtube

【解决方案1】：

我们在按钮中没有 href 属性。它在一个标签中。只需将按钮更改为标签即可。

以下行应该可以工作：

<a id="help" href="https://youtu.be/oHg5SJYRHA0" target="_blank">Get help from a low-paid professional</a>

如果你想使用按钮而不是标签。以下行应该有效：

<button id="help" onclick="window.open('https://youtu.be/oHg5SJYRHA0')">Get help from a low-paid professional</button>

【讨论】：

这似乎不起作用。如果我理解正确，你想让我用<a> 替换<button> 标签吗？如果是这样，那将删除所有按钮样式的全部目的。
它工作正常。以下是演示链接：jsfiddle.net/a9fnp43h/6
啊，现在它似乎工作了。只是想知道，不应该删除按钮标签使其不显示为按钮吗？
仅按钮使用 onclick=" window.open(url);".
不过，您必须使用按钮明确删除边框。