Sunday, February 13, 2011

The almighty FONT tag!

The <FONT> tag is ht most heavily used formatting tags. It allows you to change the size, color and font (called face in HTML) of the text.


Its easy to use it. Enclose the text withing a FONT tag pair and set some attributes.


<FONT Color = "Light Blue"> This is getting exciting! </FONT>


This will change the color of the text to Light Blue. We can set any valid color to the text.
One important thing about color attribute is that it also accepts hash code for a color.


<FONT Color = "#0000FF"> This is getting exciting! </FONT>
has the same effect as the first line as #0000FF is he hash code for light blue.


You may have notices the word "attribute". Almost all tags in HTML offer attributes, which can be set with values. Here in this case color is an attribute and blue is the value set.
HTML is not case sensitive, so we ca write the tags/attributes/values in upper/lower/title or any other case we want. But as a good programming practice always use capitals for tags.


Font tag bears more than one attribute. Next we see another important attribute "Size".


We can change the font size of the text using the size attribute.


<FONT Size= "3"> This is getting exciting! </FONT>


Size can have a value starting from 1 up to 7.


The third attribute the font takes is the "face".


<FONT Face= "Arial"> This is getting exciting! </FONT>


will make the text have arial font.


You can use them in any combination you like.


The following code:




<HTML>
   <BODY>
<FONT Size= "1Color = "Light Blue"> This is getting exciting! </FONT ><BR>
<FONT Size= "2Color = "#0000FF"> This is getting exciting! </FONT ><BR>
<FONT Size= "3Face = "Arial"> This is getting exciting! </FONT ><BR>
<FONT Size= "4Face = "Arial" Color = "Red"> This is getting exciting! </FONT ><BR>
<FONT Size= "5"> This is getting exciting! </FONT ><BR>
<FONT Size= "6Face = "Verdana"> This is getting exciting! </FONT ><BR>
<FONT Size= "7Color = "Steel Blue4"> This is getting exciting! </FONT >
   </BODY>
</HTML>




Gives this output:



Notice that the last line is actually size 7 but in default font face (Times New Roman) which is smaller that Verdana size 6.


1 comment:

  1. Oh, this is bad, this is really relly bad.
    Font Tags are evil! Don't use them!
    Do yourself a favour and buy a book about CSS.

    ReplyDelete

Please leave a comment if you have anything to say or have something to ask.. I will do my best to answer..