Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

CSS selectors apply style to all images except the first one

I thought I could do this with advanced CSS selectors, but struggling.

I have a JS Fiddle here with the below example

Basically, how can I target every image here, except the first one? I don't want to use classes or IDs, I just want to use advanced selectors, if possible.

So something like .entry-content img:first-child (although I know that wouldn't work)

<div class='entry-content'>
    <div>
        <img src='http://placedog.com/400/300'/>
    </div>
    <div>
        <img src='http://placedog.com/400/300'/>
    </div>        
     <div>
        <img src='http://placedog.com/400/300'/>
    </div>
</div>
like image 583
SparrwHawk Avatar asked Aug 22 '12 14:08

SparrwHawk


People also ask

How do I apply CSS to all elements except first?

Approach: Use the :not(selector), also known as negation pseudo-class which takes a simple selector as an argument and allows you to style all the elements except the element specified by the selector.

How do you select every element except first?

By using the :not(:first-child) selector, you remove that problem. You can use this selector on every HTML element. Another common use case is if you use an unordered list <ul> for your menu.

What is the order of precedence of CSS selectors?

Inline CSS has a higher priority than embedded and external CSS. So final Order is: Value defined as Important > Inline > id nesting > id > class nesting > class > tag nesting > tag.

Which CSS selector is used to affect only the first list item in an ordered list?

The :first-child selector allows you to target the first element immediately inside another element.


1 Answers

If you want to select all img tags except first one use :not subclass:

.entry-content div:not(:first-child) img


Working example: http://jsfiddle.net/GrAaA/


Browser support:
:not http://caniuse.com/#search=%3Anot
:first-child http://caniuse.com/#search=%3Afirst-child

like image 185
Michael Avatar answered Sep 18 '22 16:09

Michael