A recent Eric Meyer post got me thinking about the general problem of using presentational classes in CSS without including them in the markup. I have a few general solutions for this:
The Really Nice Thing about this method, is you can apply classNames based on the src attribute (the path or filename), or even more complex logic, and it will work in IE, where attribute selectors won’t.
Important: Give each presentational class a prefix to indicate which stylesheet it “belongs to”. This relieves you from worrying about which stylesheet is active if you have/add alternate ones; the script would just add all the classNames (not likely a performance hit) and the browser would apply the right style based on the active SS.
2) Don’t create a presentational class at all
Instead, just form a selector using a comma-separated list of all the IDs of elements needing a particular style:
*[src='/images/myPony.jpg'], /* CSS2, but no IE */
*[src*='/photos/'] /* CSS3, probably not IE7... */
/* photo styles */
It boils down to…