有没有一种使用CSS禁用链接的方法？
我有一个名为 current-page 的类，并希望拥有此类的链接被禁用，以便在单击时不执行任何操作。
27个回答
0
另一个技巧是在其上方放置一个不可见元素。这将禁用任何悬停效果。
.myButton{
position: absolute;
display: none;
}
.myButton::after{
position: absolute;
content: "";
height: 100%;
width: 100%;
top: 0;
left: 0;
}
- air5
0
你也可以试试这个。
<style>
.btn-disable {
pointer-events: none !important;
color: currentColor;
cursor: not-allowed;
opacity: 0.6;
text-decoration: none;
}
</style><html>
<head>
<title>NG</title>
</head>
<style>
.btn-disable {
pointer-events: none !important;
color: currentColor;
cursor: not-allowed;
opacity: 0.6;
text-decoration: none;
}
</style>
<body>
<div class="btn-disable">
<input type="button" value="Show">
</div>
</body>
</html>- Pramod Lawate
-1
pointer-events:none会禁用链接：
.disabled {
pointer-events: none;
}
<a href="#" class="disabled">link</a>
- Nikki
1
3这很好，但是如果用户使用键盘就不起作用了 :( - gztomas
-1
可以使用CSS来实现：
.disabled{
cursor: default;
pointer-events: none;
text-decoration: none;
color: black;
}<a href="https://www.google.com" target="_blank" class="disabled">Google</a>请查看：
请注意，text-decoration: none; 和 color: black; 不是必需的，但它们使链接看起来更像纯文本。
- user8903269
1
这个不起作用。
pointer-events: none只能阻止指针设备点击链接。通过按Tab键直到链接获得焦点，然后按回车仍然可以“点击”链接。 - undefined-1
这里有很多答案！
然而，我发现最有用的是纯粹的旧式 CSS：
a[disabled] {
pointer-events: none!important;
cursor: not-allowed!important;
}
- ddjerqq
1
这个方法不起作用。
pointer-events: none; cursor: not-allowed; 只能阻止鼠标点击链接。但是，通过按下Tab键直到链接获得焦点，然后按下回车键仍然可以“点击”链接。 - undefined-2
<a href="#!">1) Link With Non-directed url</a><br><br>
<a href="#!" disabled >2) Link With with disable url</a><br><br>- Rudra
2
4<a>标签没有disabled属性。 - Hexodus
1属性a没有disabled属性。 - Irrfan23
-2
只需在标签中使用您的选项卡，不要包含任何链接属性。
- Arjunsingh thakur
网页内容由stack overflow 提供, 点击上面的可以查看英文原文，
原文链接
原文链接
hidden属性来禁用。然后可以使用 CSS 选择器例如a[hidden]来选择锚点并相应地进行样式设置。 - Armen Michaelidisplay: block或其他值，你可以指示它们这样做。但是hidden并不总是适用的——它适用于无关紧要的元素，从问题中不清楚为什么链接应该被禁用。这可能是XY问题的一个例子。 - Armen Michaelipointer-events: none只是阻止了指针设备点击链接。通过按下 Tab 键直到链接获得焦点，然后按下空格仍然可以“点击”链接。 - undefined