Webmaster Resources Center

Welcome to the Bravenet Resource Center. Use these resources to help make your web pages more advanced and fun to use.

Articles & Tutorials

Inserting Style Sheets

by Jocelyn Kinnear


« Prev · 1 · 2 · 3 · Next »

Summary : When you decide that it is time to use style sheets with your webpage, you'll have to ask yourself "How should I insert my cascading style sheet?"

Well, cascading style sheets can be inserted three different ways:

  1. External Style Sheets

    External style sheets can be used with multiple pages. External style sheets are a popular choice. Since you can use them with multiple pages, you can easily keep a consistent style throughout your webpages if you use external style sheets. An external style sheet has to be linked from your webpage using the and the tags.

  2. Inline Styles

    Inline styles can be used directly in the element tag; no external pages or files needed. To use inline styles, you would just need your webpage and elements: a, img, div, span, etc.

  3. Internal Style Sheets

    Internal style sheets are recommended if you are just wanting to use one style sheet with one webpage.

Inserting the style sheets

The recommended way to would be to use an external style sheet. This way involves two basic files; your webpage file and your .css file. To use an external style sheet, you call on it from the head section of your webpage document:

<head>
<title>Example of an External Style sheet </title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>

Note that if you are using this in an xhtml, then you will want to trail the link tag with a closing slash like so:

<link rel="stylesheet" type="text/css" href="style.css" />

The href="style.css" is telling where the css file is located, so you would replace the "style.css" with the location of your style sheet.

« Prev · 1 · 2 · 3 · Next »