html - 是否可以使用 CSS 使 HTML anchor 标记不可点击/不可链接？

Question

例如，如果我有这个:

<a style="" href="page.html">page link</a>

有什么我可以用于 style 属性的东西可以使链接不可点击并且不会将我带到 page.html 吗？

或者，我唯一的选择是不将“页面链接”包装在 anchor 标记中吗？

编辑:我想说明我为什么要这样做，以便人们能够提供更好的建议。我正在尝试设置我的应用程序，以便开发人员可以选择他们想要的导航样式类型。

因此，我有一个链接列表，其中一个始终处于当前选中状态，而其他所有链接均未选中。对于未选中的链接，我显然希望它们是普通的可点击 anchor 标签。但是对于选定的链接，有些人希望该链接保持可点击状态，而另一些人则希望使其不可点击。

现在我可以轻松地以编程方式不在所选链接周围包裹 anchor 标记。但我想如果我总是可以将选定的链接包装成类似这样的东西会更优雅:

<a id="current" href="link.html">link</a>

然后让开发者通过CSS控制链接样式。

Answer 1

你可以使用这个 css:

.inactiveLink {
   pointer-events: none;
   cursor: default;
}

然后将类分配给您的 html 代码:

<a style="" href="page.html" class="inactiveLink">page link</a>

它使链接不可点击，光标样式为箭头，而不是链接的手。

或在 html 中使用此样式:

<a style="pointer-events: none; cursor: default;" href="page.html">page link</a>

但我建议第一种方法。