CODEWITHSUNDEEP
htmlcss
Daiaiai
Daiaiai

Reputation: 1089

Can I store Markup within a HTML5 data-attribute tag?

I am wondering, if/how I can add Markup to a data-attribute tag? Like:

 <i data-description="<h5>Head</h5><p>Content</p>">Foo</i>

I am using this info later on (from David Walsh) with:

 i:hover::after{content: attr(data-description);}

And it outputs the Markup as plain text. Is there any chance I could use Markup-tags in a data-attribute though?

Upvotes: 1

Views: 258

Answers (1)

Quentin
Quentin

Reputation: 943615

Text inside data attribute values will be interpreted like any other text in an attribute value. Markup will be parsed as normal for an attribute value.

You can store any text you like in the attribute. That can include content that you intend to have interpreted as markup in other places (watch out for & and " characters which will need representing as entities).

You cannot use markup in a CSS pseudo-element. This has nothing to do with where you get it from.

Upvotes: 4

Related Questions