Learn Programming

Learn HTML lesson 02 - Font styles

In this lesson we will be learning about:
Changing text color and size.
Underlining, Bold and Italics.

Changing text color and size

For colorful text we need to use the <font> tag. You must type the words that you want the color to be applied to between the tags like this:

<font>Hello</font>

Now we must give the <font> tag the color property:

<font color="red">Hello</font>

You now see a red Hello in your web browser. You can also use hex value colors:

<font color="#FF0000">Hello</font>

The first 2 digits are for red, the next 2 are for green and the next 2 are for blue. I use this picture to remember it in my head:

|R|G|B|

If we want different size text then we still use the <font> tag but we use the size property. Example:

<font size="5">Hello</font>

SIZE has a range of 1-7. 1 being small and 7 being large. Let's see if you can do this:

Hello

Underlining, Bold and Italics

The <u> tags will underline the text between them:

<u>underlined</u>

Result:

underlined

The <b> tags will make the text between them bold:

<b>bold</b>

Result:

bold

The <i> tags will make text between italic:

<i>italics</i>

Result:

italics