Adding CSS to a Tag

In this first tutorial in a series on how to code stylesheet commands we look at how to code a style command directly into an HTML tag.

We can easily add one off style commands directly into our HTML tags by using the style attribute that is available for almost all HTML tags (all of those where styles are applicable).

As an example, let's say that we want to display a small amount of text in red in order for it to stand out from the surrounding text. We can do this using the following code:

This is <span style="color:red;">red</span> text.

The page content will then appear like this:

This is red text.

As you can see from the above, we have also learned a little about how to define the values that our style attributes will have. Each style definition consists of a property (in this example - color) followed by a colon and then the value that the property is to have (in this case - red) and is finally terminated by a semi-colon.

Using what we now know we can add further style attributes within the same command. The following code will not only make the text red but will make it bold as well:

This is <span style="color:red;font:bold;">red</span> text.


This article written by Stephen Chapman, Felgall Pty Ltd.

go to top

FaceBook Follow
Twitter Follow