如何仅使用CSS禁用链接？

要实际关闭A,您必须替换它的click事件或href,如其他人所述.

PS:只是为了澄清我认为这是一个相当凌乱的解决方案,对于搜索引擎优化它也不是最好的,但我相信它是纯粹的CSS最好的.

如果您想坚持表单上的HTML/CSS,另一个选择是使用按钮.设置样式并设置disabled属性.

例如 http://jsfiddle.net/cFTxH/1/

如果您希望它只是CSS,则禁用逻辑应由CSS定义.

要在CSS定义中移动逻辑,您必须使用属性选择器.这里有些例子 :

您可以选择禁用包含特定href值的链接,如下所示:

Exact path

[href="//website.com/exact/path"]{
  pointer-events: none;
}

此处,/keyword/将禁用包含在路径中的任何链接

Contains in path

[href*="/keyword/"]{
  pointer-events: none;
}

在[attribute^=value]操作者的目标与一个特定值开始的属性.允许您放弃网站和根路径.

Begins with path

[href^="//website.com/begins/with"]{
  pointer-events: none;
}

您甚至可以使用它来禁用非https链接.例如 :

a:not([href^="https://"]){
  pointer-events: none;
}

在[attribute$=value]操作者的目标与特定值结束的属性.丢弃文件扩展名可能很有用.

Link to pdf

[href$=".pdf"]{
  pointer-events: none;
}

Css可以定位任何HTML属性.可能是rel,target,data-custom等...

Blank link

[target=_blank]{
  pointer-events: none;
}

您可以链接多个规则.假设您要禁用每个外部链接,而不是那些指向您网站的链接:

a[href*="//"]:not([href*="my-website.com"]) {
    pointer-events: none;
}

或禁用指向特定网站的pdf文件的链接:

Link to image

[href^="//website.com"][href$=".jpg"] {
  color: red;
}

自IE7以来,支持属性选择器.:not()自IE9以来的选择器.

试试这个:

该指针的事件属性,可控制HTML元素如何响应鼠标/触摸事件-包括CSS悬停/活动状态,单击/点击事件在Javascript中,光标是否是可见的.

这不是禁用链接的唯一方法,而是一种适用于IE10 +和所有新浏览器的好方法:

.current-page {
  pointer-events: none;
  color: grey;
}

This link is disabled

.current-page a:hover {
pointer-events: none !important;
}

.current-page a {
cursor: text !important;
}