Use an image name held inside an element - XML/CSS

Question

I am making a CSS file for an XML document. I need to insert an image - the filename of which is contained inside an element.

This is part of the xml code I am referring to:

<description>
   <text> Club Praia is divided and linked by a foot bridge over the main street which runs 
   through the heart of Praia Da Rocha.</text>
   <image>pria.jpg</image>
</description>

Ordinarily, I would use text:after{ content: url(filename.jpg) }, which would work if it was the same one image being used each time. Instead, I need to insert the specific image name (in this one example pria.jpg) held inside the image element tags, into the generated content code.

Is there a way I can do this? (Hope my explanation made sense!!)

Answer 1

You can definitely do this using XSLT, but if there is a pure CSS solution, I would love to see it too.

Answer 2

This will probably be possible with CSS3 named strings. However, this spec is not even halfway finished, so I'd recommend you go with XSLT.