Disable Link Using CSS but Enable Title

问题

I want to enable link using CSS but still enable title. Here is my code:

CSS and HTML Code:

.disabledLink {
   pointer-events: none;
   opacity: 0.6;
   cursor: default;
 }

<a href="www.google.com" class="disableLink" title="My Title" /> 
  <span datahover="test">My Link</span> 
</a>

Unfortunately, title is not appearing when hovering my mouse to the link. Is there a better way to enable title?

回答1:

.disabled-link {
  pointer-events: none;
}

<span datahover="test" title="My Title"><a href="www.google.com" class="disabled-link">My Link</a></span>

Change your markup into this. It will work. Instead of targeting <a> tag, I target the span for title. Hope it helps.

回答2:

You should put your span tag inside the link tag, like this:

<a href="www.google.com" class="" title="My Title"> <span datahover="test">My Link</span> </a>

来源：https://stackoverflow.com/questions/39892608/disable-link-using-css-but-enable-title