1.1 Adding CSS Inline

There are 5 ways to apply styling and layout to HTML documents:

  1. Specifiying attributes inside the tags in the HTML documents (the old way);
  2. Using CSS inline with the tags in a HTML document (known as inline);
  3. Using CSS in the head section of a HTML document (known as embedding);
  4. Using CSS in a seperate file called a stylesheet (known as linking);
  5. Importing a stylesheet from within a stylesheet (known as importing).

The first method was touched upon in the HTML Tutorial, whereas the next four methods all involve CSS and will be discussed in this tutorial.

Adding CSS Inline

CSS can be added inline with the tags in a HTML document by using the style tag. For example:

<p style="font:16px;color:blue;">Content text</p>

Adding CSS inline with the tags is no better really than using deprecated tags to add styling like below:

<p><font size="16px" color="blue">Content text</font></p>

As a result it should be avoided as it is very time consuming. However, there are instances where it is still needed, such as writing decorative Ebay product descriptions where an external stylesheet or head section is not available.