Applying CSS

Style Sheets in External Files

Link
To define an external Style Sheet to be used to format your HTML you use place a Link element in the Head area of the HTML file.

The basic tag would be:

<LINK REL=stylesheet href="mystyle.css" mce_href="mystyle.css">

HREF specifies the location and file name and REL indicates the file is a Style Sheet.

Additional Declarations include:

Media

Media is used to define the application of the CSS to its end use. If more than one external style sheet is defined with the link element the Media type would set the proper file to be used for the proper use of the page. The Media definition is not implemented in IE4 or NS4.

<LINK REL=stylesheet MEDIA=”screen” href=”mystyle.css” mce_href=”mystyle.css” TYPE=”text/css”>

You can also define more than one profile with comas between the values.

Media=Print,Screen,Aural

PRINT – For documents viewed on screen in print preview mode.

SCREEN – a continuous presentation for computer screens.

PROJECTION – paged presentation for projected presentations.

BRAILLE – for Braille tactile feedback devices.

AURAL – aural presentation, e.g. for a speech synthesizer.

ALL – the default value, the style sheet applies to all output devices.


Title

The Title Attribute can be used to define the type of style sheet. Not using the TITLE tag makes your file persistent. This means the Selectors in a file without a title will always be applied to the document.

TITLE=”default”

If you define more than one Style Sheet to be applied to your document you can use the title attribute to group them.

<LINK REL=”alternate stylesheet” TITLE=”bluepage” href=”b-paragraph.css” mce_href=”b-paragraph.css”>

<LINK REL=”alternate stylesheet” TITLE=”bluepage” href=”b-tables.css” mce_href=”b-tables.css”>

<LINK href=”largefont.css” mce_href=”largefont.css”>
TYPE can be used to describe the file type of the Style Sheet.

<LINK href=”mystyle.css” mce_href=”mystyle.css” TYPE=”text/css”>


Meta Tag

The Meta element can be used on your page to identify to the Enduser’s client that your page includes CSS information.

<META HTTP-EQUIV=”Content-Style-Type” CONTENT=”text/css”>


Style Sheet use by the Enduser

If the Enduser would like to construct their own style sheet they would follow the same method as an author that is constructing an external style sheet. However because the enduser will not be able to prepare style selectors that will override all the possible ID and Class Element Declarations the enduser’s User Agent should be able to ignore server side Style Sheets.

Internet Explorer agents define the client side Style Sheet in the Internet Options – General Tab Under the Accessibility area.