0

I got a great answer to my question here about showing a "hover tip" when over a particular segment of text (plus other helpful tips).

But then I thought: Rather than writing "Title="Bla bla bla bla" in a gazillion places, is it possible to delegate that to the CSS class, like so:

.billybob
{
    color: lime;
    Title="this is the title for Billy Bob";
}

I have an example of trying that out here, but no joy in Mudville.

Is it possible, or am I stuck with explicitly adding the Title to every place where a class is referenced in HTML?

Community
  • 1
  • 1
B. Clay Shannon-B. Crow Raven
  • 8,547
  • 144
  • 472
  • 862
  • 1
    Well technically you can write content using pseudo-element selectors `::before` and `::after` and `conent`property but you won't affect existing attributes, just writing text (or images) in the pseudo-element you're defining. Be carefull using this though, CSS are not the place for content just as HTML is not the place for styling... When dealing with a multilingual site you'll soon discover why it's a bad idea. – Laurent S. Mar 11 '15 at 18:26
  • You can use a pseudo element, but I am not sure I fully understand your question. – cport1 Mar 11 '15 at 18:26
  • I'd suggest taking a look at [this answer](http://stackoverflow.com/questions/1055581/how-do-i-add-a-tool-tip-to-a-span-element/25836471#25836471), and then using the `content` property to achieve this via a pseudo element... for example - http://jsfiddle.net/hs3dok9z/ – Josh Crozier Mar 11 '15 at 18:27
  • As others have said you can using the the pseudo-element 'content'. The real question is should you.... – tonyedwardspz Mar 11 '15 at 18:32

2 Answers2

3

The closest you can get is using a pseudo element.

.billybob:before {
    content: 'This is a title for Billy Bob';
}
Brian
  • 2,819
  • 4
  • 24
  • 30
  • To supplement your answer.. you could achieve something [like this](http://jsfiddle.net/ehccngdo/) via a pseudo element. (It's based on [this answer](http://stackoverflow.com/questions/1055581/how-do-i-add-a-tool-tip-to-a-span-element/25836471#25836471)) – Josh Crozier Mar 11 '15 at 18:32
  • It should be noted that this is not, as the title seems to ask, "HTML markup" - it is text. Also, if you care at all about accessibility, you should be wary of using this to insert important content. – Heretic Monkey Mar 11 '15 at 18:39
2

Sorry you can't. CSS is a presentation language. It can not be used neither designed to add content (except for :before and :after pseudo element).

You can though achieve it with Jquery as

$('.billybob').attr('title','this is the title for Billy Bob')
Tushar Gupta
  • 15,504
  • 1
  • 29
  • 47
  • I would mark this as the answer, because I like this solution the best, but since I (wrongly, I reckon) asked specifically about how to do it in CSS, I won't (just give it an uptick). – B. Clay Shannon-B. Crow Raven Mar 11 '15 at 18:57