CODEWITHSUNDEEP
htmlcss
Piccolo
Piccolo

Reputation: 1666

Is it possible to style certain text inside of a title attribute?

Suppose I have a link <a href="#" title="Hello, World!">. I want to style parts of the title tooltip attribute. For example, I want to have the Hello part be bold. I'm not trying to style both Hello and World, just the Hello part.

I have tried putting HTML tags inside of the attribute, but they appear to have no effect (if I enter <a href="#" title="<b>Hello,</b> World!">, the title text prints out <b>Hello,</b> World!, which is not what I want. I have made a JSFiddle demo of what happens.

Is it possible to do this using pure CSS?

Also, I have seen this, but it's not what I wanted. It's close, however.

Upvotes: 1

Views: 3570

Answers (2)

Afshin Mehrabani
Afshin Mehrabani

Reputation: 35009

You can't put HTML in the attribute title, it's not a valid code but I beleive you can use hint.css library: http://kushagragour.in/lab/hint/. Completely css-based and easy-to-use:

<a href="http://somewhere/" class="hint  hint--bottom" data-hint="Hello" title="Hello world">Your link</a>

Upvotes: 2

ParPar
ParPar

Reputation: 7569

I think the only way for you to achieve what you want is to make a div with the style you want, hide it, and on hover - show it.

Upvotes: 1

Related Questions