HTML Basix - HTML tutorials and online webmaster tools


Htaccess code generators Code generators Tutorials

Online and offline code generators


Subscribe to RSS feed
Subscribe to the HTML Basix RSS feed.
Introduction  1  2  3  4  5  6  7  8  9  10  Home


Lesson 3

Adding some colour to your words...

The tag you use to manipulate text is <font>. Just this tag alone will do nothing, we need to add a value to it. Let's make your text red. As you have found previously, you start the area concerned with a tag. What you need to do is BEFORE the sentence you typed in, and AFTER the <body> tag, because this is all part of the body...type in <font color="red">. Now save your notepad and refresh your html page. You should now have red text!!!

As you've used an opening tag <font>, you need to finish it. So, after the end of your sentence type in </font>. To give an example of how this works, try putting the </font> in the middle of your sentence instead of the end. Save and refresh your page, and you will be able to see why it's important that you close the tags where you're supposed to. It's not hard to do, but you need to know that it's important.

To see what your notepad is supposed to be looking like, click here.


Have a little play. Change the colour from red to green, or yellow, or blue. Refresh your page each time to see the results. Pretty easy, isn't it?


Using more colours...

You've learnt how to make red text, as well as green, yellow etc...but what if you don't want one of those basic colours? What if you want your text to be this shade of green or this shade of red?
This is where a colour chart comes into play, which lists all of the colours you can use. Click here for the colour chart. All you do to use any of the colours on the colour chart is put the colour # in instead of the colour name. For example, you would type in "<font color="#FF99CC">" to get this colour.


Get creative with your colour!!

How about something like this?

Quite simple really...you just need to specify the font colour of each letter. Remember to 'close' the font colour of EACH letter with "</font>". Click here to see what the coding looks like for this.

You've got the hang of colouring text. Now for text styles, sizes, stuff like that in lesson 4!

Introduction  1  2  3  4  5  6  7  8  9  10  Home




Site Stats     
[an error occurred while processing this directive]
   You beaut











This site is © HTML Basix 2003 - 2009