28. XHTML Style Sheet Module

Contents

28.1. The style element
- 28.1.1. External style sheets
- 28.1.2. Preferred and alternate style sheets
- 28.1.3. Specifying external style sheets

This section is normative.

The Style Sheet Module defines an element to be used when declaring internal style sheets. The element and attributes defined by this module are:

Elements	Attributes	Content Model
style	Common, disabled ("disabled"), media (MediaDesc)	PCDATA

Implementation: RELAX NG

28.1. The style element

Attributes

The Common collection: A collection of other attribute collections, including: Bi-directional, Core, Edit, Embedding, Events, Forms, Hypertext, I18N, Map, and Metainformation.

disabled = "disabled": When present, this boolean attribute makes the current element inactive (e.g., a "disabled" style element would have its styles removed from the active style collection).

media = MediaDesc

The value of this attribute specifies the types of media for which the element is intended. When the value of this attribute matches the current processing media, the element is processed as normal; otherwise it is ignored. The default value for this attribute is all.

Example

<style src="style.css" type="text/css" media="screen" />
<span src="photo.jpg" media="screen">Me at work</span>
<span src="photo-hires.jpg" media="print">Me at work</span>

The style element allows an author to put style sheet rules in the head of the document. XHTML permits any number of style elements in the head section of a document.

The syntax of style data depends on the style sheet language.

Rules for style rule precedences and inheritance depend on the style sheet language.

Example

<style type="text/css">
  h1 {border-width: thin; border-style: solid; text-align: center}
</style>

28.1.1. External style sheets

Authors may separate style sheets from XHTML documents. This offers several benefits:

Authors and web site managers may share style sheets across a number of documents (and sites).
Authors may change the style sheet without requiring modifications to the document.
User agents may load style sheets selectively (based on media descriptors).

28.1.2. Preferred and alternate style sheets

XHTML allows authors to associate any number of external style sheets with a document. The style sheet language defines how multiple external style sheets interact (for example, the CSS "cascade" rules).

Authors may specify a number of mutually exclusive style sheets called alternate style sheets. Users may select their favorite among these depending on their preferences. For instance, an author may specify one style sheet designed for small screens and another for users with weak vision (e.g., large fonts). User agents should allow users to select from alternate style sheets.

The author may specify that one of the alternates is a preferred style sheet. User agents should apply the author's preferred style sheet unless the user has selected a different alternate.

Authors may group several alternate style sheets (including the author's preferred style sheets) under a single style name. When a user selects a named style, the user agent must apply all style sheets with that name. User agents must not apply alternate style sheets with a different style name. The section on specifying external style sheets explains how to name a group of style sheets.

Authors may also specify persistent style sheets that user agents must apply in addition to any alternate style sheet.

User agents must respect media descriptors when applying any style sheet.

User agents should also allow users to disable the author's style sheets entirely, in which case the user agent must not apply any persistent or alternate style sheets.

28.1.3. Specifying external style sheets

Authors specify external style sheets using the xml-stylesheet processing instruction [XMLSTYLE], or, for CSS, by using the @import facility within a style element.

User agents should provide a means for users to view and pick from the list of alternate styles, if specified.

In this example, we first specify a persistent style sheet located in the file mystyle.css:

Example

<?xml-stylesheet href="mystyle.css" type="text/css"?>

Setting the title pseudo-attribute makes this the author's preferred style sheet:

Example

 <?xml-stylesheet href="mystyle.css" title="compact" type="text/css"?>

Adding the alternate pseudo-attribute makes it an alternate style sheet:

Example

<?xml-stylesheet href="mystyle.css" title="Medium" alternate="yes" type="text/css"?>