Connecting a CSS Stylesheet to an HTML Document

If you use a stylesheet, you must connect it to the document with one of three connection methods, indicated in the document head:

Linked	Imported	Internal/Embedded/Document
<head> <link type="text/css" href="url" rel="stylesheet"> </head>	<head> <style type="text/css"> <!--@import url(url);--> </style> </head>	<head> <style type="text/css"> <!--rules--> </style> </head>

Notes

Notation

italic type = variable (substitute the desired value)
regular type = constant (enter exactly)

Inline styles

Instead of connecting an entire stylesheet to an entire document, you could apply a single CSS rule to a single tag within the document. For syntax, see “Inline Styles” in “CSS vs. HTML: Style Syntax Comparison.”

Hiding statements from old browsers

In the second and third columns of the table, I comment out the statements within the <style> container, to hide them from old browsers. Using this tactic has some risk; not using it has more risk. (See “Bringing CSS and HTML Together,” page 16, in Meyer’s book.)

For more information

Barbara Leeds, “CSS vs. HTML: Style Syntax Comparison”
Eric Meyer, Cascading Style Sheets: The Definitive Guide (O’Reilly)
Jennifer Niederst, HTML Pocket Reference (O’Reilly)

This document appeared for many years on the Silicon Valley WebGuild website.
barbaraleeds@yahoo.com, 8-17-2006