Cross-references

User Guide / Generated Content

Prince supports cross-references using generated content with two special functions: target-counter and target-content.

Using target-counter

The target-counter function can be used with the content property to reference the value of a counter at a linked element.

CSS

a[href]::after {
    content: " [See page " target-counter(attr(href), page) "]"
}

This will add a cross-reference after every link with the correct page number determined automatically. For example: [See page 17].

The target-counter function can specify any counter, allowing cross-references to refer to list items, chapters or sections as well as pages.

The target-counter function can also take an optional counter style, similar to the normal counter function.

CSS

a[href]::after {
    content: " [See chapter "
	     target-counter(attr(href), chapter, upper-roman) 
	     "]"
}

This will add a cross-reference after every link with the correct chapter number determined automatically and displayed using roman numerals. For example: [See chapter IV].

Using target-content

The target-content function can be used with the content property to reference the text content of a linked element.

CSS

a[href]::after {
    content: " [See '" target-content(attr(href)) "']"
}

This will add a cross-reference after every link that includes the text of the element being linked to, such as a chapter title. For example: [See 'Introduction'].