html - 如何在不影响具有链接的 <button> 标签的情况下设置 <a> 标签的样式？

Question

我想知道你如何设计 <a>不影响 <button> 的标签标签。

a:hover{
text-decoration: underline;
}

<link rel="stylesheet" href="http://mrredblob.com/wordpress/wp-content/themes/homework/style.css">
<a href="#"><button>A link</button></a>

Answer 1

如果您需要使用一个类似 button 的 anchor 显示 - 这样点击它就会重定向到另一个页面，您可以使用这样的东西:

<button onclick="location.href='https://www.google.com'">A link</button>

onclick 事件将在用户单击按钮时执行，并将用户重定向到适当的页面。

您可以通过将以下内容粘贴到浏览器的新选项卡中来查看它的工作情况:

data:text/html;charset=utf-8,<button onclick="location.href='https://www.google.com'">A link</button>

_{由于 snippet 的 iframe 上的 ~sandbox 限制，它不会在 snippets/JS Fiddle 中工作。}