Types of CSS Styles

Inline, Embedded, and External Style Sheets

There are three types of CSS styles:

  • inline styles
    Inline styles are styles that are written directly in the tag on the document. Inline styles affect only the tag they are applied to.
    <a href="" style="text-decoration: none;">
  • embedded styles
    Embedded styles are styles that are embedded in the head of the document. Embedded styles affect only the tags on the page they are embedded in.
    <style type="text/css">
    p { color: #00f; }
  • external styles
    External styles are styles that are written in a separate document and then attached to various Web documents. External style sheets can affect any document they are attached to.
    <link rel="stylesheet" type="text/css" href="styles.css" />

CSS best practices recommends that you use primarily external style sheets for styling Web pages so that you get the most benefit of the cascade and inheritance.