Beginning XHTML

Printing and Paginated Media

Earlier in this chapter, we talked about media groups. One of these media groups dealt with presentation to continuous and paginated media.

As we said before, paginated media is different from continuous media in that the document content is split into discrete 'pages' when it is rendered. Continuous media, as its name implies, does not split the document content, keeping it as one continuous entity when it is rendered.

In summary, there are three ways of handling printed media:

• print media type
• page breaking properties
• @page rule

You can use any or all of these methods when creating a document.

The print media type allows us to change the presentation of the document: things like whether to use a serif or a sans-serif font, which the font-size, background-colors, etc. We talked about the print media type and other media types earlier in this chapter.

The page breaking properties allow us to relate how content is displayed on the pages defined by the @page rule: things like avoiding page breaks before certain elements and forcing an image to appear on a right-hand page, etc.

The @page rule allows you to define the context for printing - in essence, it allows you to describe the paper: things like the size of the paper, its margins, and so on.

We will learn about the @page rule and the page breaking properties in the following sections.

Page Breaking Properties

Page breaking properties provide a way for us to control where page breaks (i.e. where one page ends and the next one begins) occur when our document is printed. New sections and chapters often begin on new pages and you may wish to control page breaks around images (perhaps forcing a page break before an image or preventing a page break following an image).

For example, if we want to make a paragraph start on a new page, we would write:

<p style="page-break-before: always">
  This is the first paragraph of text on a new page.
</p>

In this example, we set the page-break-before property to always, which means that a page break will always occur before this paragraph.

You can also use style sheets, as in this example:

h1 { page-break-before: always }

This means that every level-one header will start on a new printed page.

There are several page breaking properties:

• page-break-before
• page-break-after
• page-break-inside
• orphans
• widows

Each of these properties can have different values that affect whether the page break occurs all of the time or under special conditions.

The 'page-break-before' and 'page-break-after' Properties

As you can guess, the page-break-before property controls whether a page break occurs before an element. Likewise, the page-break-after property controls whether a page break occurs after an element. Both of these properties can have one of the following values and meanings: