<head>          Begin head section

    <link rel="stylesheet" type="text/css"   href="[path] [filename.css]">
 </head>         End head section


Reference External Style Sheets

The external style sheet is the most practical use of CSS in an HTML document. It is linked in the head section of an html document as shown to the right..

The syntax for inserting the required style structure is shown to the right. You must construct a empty elment link using the link tag <link> to include a style sheet into your html document. This type of element does not have an ending tag.

Notice that the type attribute with the value "text/css" is also used in the start tag with the href attribute which is used to reference which locates of the style sheet. The rel attribute is used to defines the relationship between the current document and the targeted document.

Tryit: Using an existing html document,

  • Insert the link element above above into the html document
  • create a css file with the selector p used on the previous page to see the font change for all paragraphes in the document.

Creating External Style Sheets

To get started with creating external CSS, you will need a plain text editor like Notepad to the right. Open this plain text notepad editor by selecting the following,when in a Windows environment: START->All Programs -> Accessories Menu ->NotePad. (SEE DEMO: How to open notepad).

The format for creating this type of documnt is to simply enter css syntax and save the file with a file name and extention of css (ex: filename.css)






CSS & HTML    -    LESSON 2