The Web Design Group

style - Embedded Style Sheet

Syntax <style>...</style>
Attribute Specifications
Contents An embedded style sheet
Contained in head

[This page has not yet been updated to reflect the new interpretation of embeded contents.]

The style element embeds a style sheet in the document. Any number of style elements may be contained in the head of a document.

The required type attribute of style is used to specify the Internet media type of the style language. For Cascading Style Sheets, the type attribute value should be text/css.

The optional title attribute gives a title for the style sheet. Without a title attribute, the style sheet is always applied when style sheets are enabled. With a title attribute, the style sheet is automatically applied but the user may choose to disable the style sheet while keeping or enabling other style sheets. Style sheets with the same title are considered to be the same style sheet.

Most current browsers ignore the title attribute on style sheets and do not allow the user to selectively enable or disable individual style sheets.

The media attribute specifies the media on which the style sheet should be applied. This allows authors to restrict a style sheet to certain output devices, such as printers or aural browsers. The attribute's value is a comma-separated list of media descriptors. The following media descriptors are defined in XHTML 1.0 and are case-sensitive:

Netscape Navigator 4.x incorrectly ignores any style element with a media value other than screen. For example, media="screen, projection" will cause the style sheet to be ignored by Navigator 4.x, even if the presentation device is a computer screen. Navigator 4.x also ignores style sheets declared with media="all". Most other browsers ignore the media attribute.

An example of an embedded style sheet follows:

<style type="text/css" media="screen">
  BODY  { background: url(foo.gif) red; color: black }
  P EM  { background: yellow; color: black }
  .note { margin-left: 5em; margin-right: 5em }

Pre-HTML 3.2 browsers, unaware of the style element, would normally show its contents as if they were part of the body, thus making the style sheet visible to the user. Using external style sheets avoids this. Any occurrences of < and & should be quoted as &lt; and &amp; in embeded style sheets.

An embedded style sheet should be used when a single document has a unique style. If the same style sheet is used in multiple documents, then an external style sheet would be more appropriate.

More Information