12

I just found the CSS @page directive, and using it with :first to apply CSS to the first page of an html print. Is there any way to go the opposite, and apply CSS to all pages except the first?

BoltClock
  • 700,868
  • 160
  • 1,392
  • 1,356
eidylon
  • 7,068
  • 20
  • 75
  • 118

2 Answers2

20

Use CSS3's :not() together with @page:

@page :not(:first) {
}

If you need better browser compatibility, Donut's solution of styling everything then "undoing" them for :first also works (relying on specificity/the cascade).

@page {
    /* Styles for everything but the first page */
}

@page :first {
    /* Override with perhaps your stylesheet's defaults */
}
jpaugh
  • 6,634
  • 4
  • 38
  • 90
BoltClock
  • 700,868
  • 160
  • 1,392
  • 1,356
  • I can't really go Donut's route, as this is an inherited project, which we've been tasked to rewrite, but to which they wanted some changes to the original site. But, since we ARE rewriting it, they don't want to pay for much on the old site, and unfortunately, that would be MUCH, as the old site wasn't done with much use of includes, and has everything recoded in every page (all 300+ of them). – eidylon Dec 20 '10 at 19:23
  • Can the `@page` directive be used for nesting? I tried doing `@page :not(:first) #Container { my-rules-here }` and it doesn't seem to work. – eidylon Dec 20 '10 at 19:24
  • @eidylon: I don't think so... I've not worked with print styles — much. – BoltClock Dec 20 '10 at 19:27
  • Ah, guess I may need to try going the javascript/jQuery route, and see if that works. Thanks! – eidylon Dec 20 '10 at 19:34
7

If you're using CSS2, you can do it indirectly. Use @page to set the style that you want for all your pages except the first, then use @page along with :first to "undo" those styles for the first page.

Donut
  • 110,061
  • 20
  • 134
  • 146