How to change the style of the title attribute inside an anchor tag?

前端 未结 10 1313
故里飘歌
故里飘歌 2020-11-21 22:27

Example:

 Link 

How do I change the presentation of the \"title\" attribute in th

10条回答
  •  悲哀的现实
    2020-11-21 22:57

    It seems that there is in fact a pure CSS solution, requiring only the css attr expression, generated content and attribute selectors (which suggests that it works as far back as IE8):

    a[title]:hover:after {
      content: attr(title);
      position: absolute;
    }
    

    Source: https://jsfiddle.net/z42r2vv0/2/

    update w/ input from @ViROscar: please note that it's not necessary to use any specific attribute, although I've used the "title" attribute in the example above; actually my recommendation would be to use the "alt" attribute, as there is some chance that the content will be accessible to users unable to benefit from CSS.

    update again I'm not changing the code because the "title" attribute has basically come to mean the "tooltip" attribute, and it's probably not a good idea to hide important text inside a field only accessible on hover, but if you're interested in making this text accessible the "aria-label" attribute seems like the best place for it: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-label_attribute

提交回复
热议问题