CSS2 » Other » @page

Version: Level 2

Compability: IE5+  N6+

@page page-selector pseudo-class { style-rules };

The @page at-rule is used to set a collection of style rules which define page context on a document level.

The page-selector component is a string that is used to provide a unique name for this set of style rules. This name provides a simple means of uniquely referencing these rules. For example, if you were creating a birthday card, you could use birthday-card as the page-selector.
The style-rules is a set of one or more style rules that you wish to apply to the document. The entire set in enclosed by a pair of left and right curly braces { }. In addition to the regular CSS2 style rules, there are style rules which are exclusive to the @page at-rule. They include:
marks, orphans, page, page-break-after, page-break-before, page-break-inside, size, and windows.
A full explanation of these exclusive style rules would be extremely lengthy and is beyond the scope of this Quick Reference. As a starting point, the Guru recommends that you refer to Chapter 13 of the W3C standard on Paged Media.
The syntax for an at-rule is an @ symbol, followed immediately by an unique identifier, which in turn is followed by the block which contains content that is applied on a document level. The block syntax is either:

  • all content contained between a pair of curly brackets,
  • or is all content contained between the unique identifier and a semi-colon.
There are five at-rules: @charset, @font-face, @import. @media, and @page.


@page birthday-card:right { margin-bottom: 3in; margin-left: 2in; margin-right: 2in; margin-top; 1in; }
Language(s): CSS2

See Also: