Styling Previous/Next Pages differently from Index

Question

A friend of mine pointed me towards using child elements to style my index page so that I could have one loop and several different visual styles (a featured post, a smaller sub-featured post, and several smaller thumbnails). This is very helpful in that I can add posts and the existing posts will just flow through this styling.

For example, I can style the .hentry class by:

.hentry:nth-child(3)
{
background-color:#00000;
}

And so on.

The problem I run into is when clicking on the next/previous links on the bottom of the content portion, those following pages maintain that styling. Is there a way I can style those pages differently?

URL: http://piquantblog.com

Thanks in advance!

Answer 1

Your theme's body_class can be used to target specific pages:

body.home /* front and subsequent pages */
body.paged /* any page *except* front page */

Answer 2

I believe that Milo's answer is the easiest and most elegant solution. However, I do want to highlight a little-known alternative. The Template Hierarchy includes an almost unknown template file, paged.php, that only gets loaded if:

1. The current context is paged
2. The current context is an archive
3. None of the archive-tree template files (archive.php, date.php, {taxonomy}.php, author.php, etc.) exist

These conditions are almost never all concurrently true; thus, paged.php is almost never invoked. But it is there, available for use, and would work in the OP's scenario.