Tuesday, January 3, 2012

New Beginings:part 5


Hello and welcome to another part (part 5) of the HTML series. In the previous part (part 4), I discussed the color attribute and its application in a body tag.
 In this post I want to explain how the color attribute can be used in another tag (the font tag). When used in the font tag, it “tells” the browser that you wish to display all the text in between the tag in that particular font, text size and color you specified.

E.g
let us take a look at a use of the font tag   <font> ..... some text .... </font>

we could modify the above tag combination by adding color=" your color ", size=“a number representing the size” or face=“font_family e.g. Arial” to the body opening tag.

i.e.  <font face=“Arial” size="3" color="red">This is WebsiteNBlogs, a site that contains all you need to know about websites and blogs. </font>

The above font formatting will change the font style/face, size and color of the sentence in-between the font tags to a size 3 Arial type font with its color being red.... As in the previous tutorial of the body tag, you can also use other colors.....hex codes can also be used to specify the color, a list of HTML color codes can be found here.
To use the hex code in a font tag is the same as in a body tag, you have to place a hash symbol before you text in the hex code. This is to " tell " the browser that you are inputting a code and not names ... 

E.g  <font color=#thehexcode> ...some text...</font>

i.e. <font color="#00FF00"> ..some text..</font>     changes the font color to Green.

Remember that RGB ( stands for Red Green Blue) color code ... so to specify maximum color use FF… that is why i used R(00) G(FF) B(00) to display the green above meaning, zero value for red, maximum value for green and zero value for blue; hence the code 00FF00.

 You can also use the RGB directly,
i.e. <font color="rgb(255,0,0)"> ..some text.. </font>     changes the font color to red.

As in the last part, I have also included a complete table showing how to use the various version of using the color attribute below...
Value
Description
color_name
Specifies the background color with a color name (like " red ")
hex_number
Specifies the background color with a hex code (like "#ff0000")
RGB_number
Specifies the background color with an rgb code (like " rgb(255,0,0) ")

The font tag also supports the following attributes

Attribute
Value
Description
class
classname
Specifies a classname for an element
dir
ltr    rtl 
Specifies the text direction for the content in an element
Id
id
Specifies a unique id for an element  

lang element
Language_code
Specifies a language code for the content in an element
style
Style_definition
Specifies an inline style for an element
title
text
Specifies extra information about an element
           
This is the same complete but simple page I posted in the last part (part 4) showing the full usages of the color attribute. The only edition I made to the HTML page is the font tag; I modified it with the other attribute (face and size) I discussed earlier in this post.

<html>
<body bgcolor="#FF0000">
<h1>Hello world!</h1>
<p>
<center>
<font face=  “verdana” size=“4” color="red">This is some text!</font> 
<a href="http://www.websitesnblogs.blogspot.com">visit here for HTML Tutorials!</a>
</p>
</center>
</body>
</html>

A point I should make here is that presently CSS implementation of the font face, size and color is being used. It is recommended that you use CSS.
I will discuss a very important HTML tag in the next post, a must to know if you want to make a website or a blog or already have one. See you in the next post...



Happy New Year from WebsitesNBlogs

No comments:

Post a Comment