Different background for even/odd blocks in same region?

Different background for even/odd blocks in same region?

Amir Elion -
回帖数：5

Would it be possible to have different background colors for even/odd blocks in same region using css?

So say, 1st, 3rd, 5th...block would have grey BG, while 2nd, 4th, 6th...would have blue?

Thanks

Amir

平均分： -
回复Amir Elion

Re: Different background for even/odd blocks in same region?

Gareth J Barnard -
Core developers的头像 Particularly helpful Moodlers的头像 Plugin developers的头像

Yes: http://www.w3.org/Style/Examples/007/evenodd.en.html

平均分： -
回复Gareth J Barnard

Re: Different background for even/odd blocks in same region?

Amir Elion -

Thanks Gareth,

But what css should be used for blocks in a specific region to behave like that?

Thanks

平均分： -
回复Amir Elion

Re: Different background for even/odd blocks in same region?

Gareth J Barnard -
Core developers的头像 Particularly helpful Moodlers的头像 Plugin developers的头像

Hi Amir,

You can use browser development tools and the example to work out the CSS within the 'aside' tag for the correct selector to use.

Cheers,

Gareth

平均分： -
回复Gareth J Barnard

Re: Different background for even/odd blocks in same region?

Amir Elion -

The thing with blocks is that they are not always in the same list, e.g. there are things like "skip-block" between them etc. so it's not part of the same list of items in the div.

平均分： -
回复Amir Elion

Re: Different background for even/odd blocks in same region?

Mary Evans -

Something like this should work...I think?

#block-region-side-pre .block:nth-child(even) {
    background: red;
}

#block-region-side-pre .block:nth-child(odd) {
    background: blue;
}

#block-region-side-post .block:nth-child(even) {
    background: green;
}

#block-region-side-post .block:nth-child(odd) {
    background: yellow;
}

Edit:

平均分：Useful (1)