Producing web pages
* HTML CSS DHTML XHTML A to Z of tags        Accessibility          Design

Adding style sheets to your web pages

You can use style sheets in several ways. You can:

  • Add inline styles to your HTML page. This gives you a quick way to define the appearance of a single tag, a group of tags or a block of information on your page
  • Embed a style sheet in your HTML page to define the appearance of a single page
  • Link to a style sheet from your HTML pages. This method allows you to define the appearance of all your web pages at once
  • Import a style sheet into your page

You can mix any of the methods of adding style to your page. You might want to:

  • Link to your standard style sheet for consistency but provide variations with an embedded style sheet
  • Link to your standard style sheet but override several specific tags using inline styles
  • Link to more than one style sheet file. You could use one style sheet to store the basic page layout and others to customise the layout for different types of pages
  • If user style sheets are supported, use your style sheets to provide formatting that is essential to your page design but let users adjust the point size and typeface to suit their personal preferences
  • If you use several style sheets that have conflicting style information, the cascading order becomes important. Your style sheet overrides the user's style sheet, which, in turn, overrides the browser's default values. If you use a mixture of methods to add styles, the inline styles override the embedded <style> block, which overrides the linked style sheet.