So I know about pseudo elements, I know you can insert content through the css content:”” property, I know you can even place urls to images in the content:”” property and I know you can query html attribute values of the html element the pseudo element was defined on.
But is it possible to combine all these into one (in other words, can I get the url from a data- attribute, insert it into the content property of a pseudo element and use it as an image)?
This would be the html:
<div class=”me” data-image=”img/background.jpg”>… </div>
This would be the css:
I’ve tried a couple of things but couldn’t get it to work. Is it simply impossible or am I making a small syntax error somewhere?