CSS regex inside selector

Question

I am trying to apply some rules on a set of img elements whose id begins with "sth". I know how to select them:

img [id^=sth]

But is there a way to use this image specific id inside the selector? In other words, can I somehow do this:

img [id^=sth] {
    src: id;
}

May or may not. But anyway, src is not a valid CSS property of <img>, so I don't think your specified example can work. — Passerby
– Passerby, Commented Mar 11, 2013 at 7:59
Ok, this was just for example purposes, what I need is to use the id as a part of the name of an image. — Banana
– Banana, Commented Mar 11, 2013 at 8:25
src, name, title, alt are all not valid CSS property of <img> (name is even an obsoleted HTML attribute as of HTML5), so there's really not much you can do. — Passerby
– Passerby, Commented Mar 11, 2013 at 8:31

freshbm · Accepted Answer · 2013-03-11 08:35:29Z

2

You can't do that with css but you can use jQuery:

$("div[id^='sph']").each(function() {
    $(this).attr("src", this.id);
});

answered Mar 11, 2013 at 8:35

freshbm

5,6326 gold badges50 silver badges81 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

xpy · Accepted Answer · 2013-03-11 07:51:15Z

0

You can only use an attributes value in a pseudo element :before or :after via the content attribute:

div:after{
content:attr(id);
}

answered Mar 11, 2013 at 7:51

xpy

5,6713 gold badges32 silver badges52 bronze badges

Indeed - you cannot write to an element's attribute using CSS, you can only read from it and use it for generating content.