HTML-FORMATTING

 

HYPER TEXT MARKUP LANGUAGE

                                        PART-3

TODAY I’II DISCUSS ABOUT FORMATTING TAGS OF HTML. FORMATTING TAGS MEAN HOW TO FORMAT ANY WRITTEN ARTICLE IN HTML THAT IS TO MAKE IT BOLD OR ITALIC OR TO CHANGE THE TEXT COLOUR OR SIZE etc.

FIRST FORMATTING TAG IS BOLD <b> TAG:

AS FOR EXAMPLE WE WRITE A PARAGRAPH AND MAKE IT BOLD.

CODING:-

<!DOCTYPE html>

<html>

<head>

<title> IT IS A EXAMPLE OF BOLD TEXT</title>

</head>

<body bgcolor="yellow">

<p> <b> <font color="red" size=7>FORMATTING TAGS MEAN HOW TO FORMAT ANY WRITTEN ARTICLE IN HTML THAT IS TO MAKE IT BOLD OR ITALIC OR TO CHANGE THE TEXT COLOUR OR SIZE etc.</font> </b> </p>

</body>

</html>

Result:-



Here <b>…………</b>  indicates the Bold Text. It is a Closed Tag.

SECOND FORMATTING TAG IS ITALIC <i> TAG:

ITALIC TAG <i>  DISPLAYS THE TEXT IN ITALIC FORMAT. IT IS A CLOSED TAG.

CODING:-

<!DOCTYPE html>

<html>

<head>

<title> IT IS A EXAMPLE OF ITALIC TEXT</title>

</head>

<body bgcolor="ORANGE">

<BR><BR><BR><BR><BR><BR>

<CENTER>

<p> <i> <font color="GREEN" size=7>

IT IS AN ITALIC TEXT WHICH DISPLAYS  ITALIC FORMAT OF A TEXT</font> </i> </p>

</CENTER>

</body>

</html>

RESULT:-

 


THIRD FORMATTING TAG IS UNDERLINE TAG <u>……..</u> :-

 

TO PROVIDE A TEXT UNDERLINE i.e. TO MAKE A TEXT UNDERLINED THIS TAG IS USED.IT IS A CLOSED TAG.

SYNTAX:- <u>………………………. </u>

CODING:-

<!DOCTYPE html>

<html>

<head>

<title> IT IS A EXAMPLE OF UNDERLINED TEXT</title>

</head>

<body bgcolor="PINK">

<BR><BR><BR><BR><BR><BR>

<CENTER>

<p> <u> <font color="GREEN" size=7>

IT IS AN UNDERLINED TEXT WHICH DISPLAYS  UNDERLINE FORMAT OF A TEXT</font> </u> </p>

</CENTER>

</body>

</html>

 RESULT:-

 

FOURTH FORMATTING TAG IS STRIKE TEXT TAG :-

 SOMETIMES WE HAVE TO STRIKE A TEXT, FOR THAT PURPOSE THIS TAG IS USED. THIS IS A CLOSED TAG.

SYNTAX:- <strike>……………………………. </strike>

CODING:-

<!DOCTYPE html>

<html>

<head>

<title> IT IS A EXAMPLE OF UNDERLINED TEXT</title>

</head>

<body bgcolor="OLIVE">

<BR><BR><BR><BR><BR><BR>

<CENTER>

<p> <strike> <font color="RED" size=7>

IT IS A EXAMPLE OF STRIKED TEXT</font> </strike> </p>

</CENTER>

</body>

</html>

 RESULT:-

 


FIFTH TAG IS SUPERSCRIPT TAG:- <SUP>

 

SOMETIMES WE HAVE TO MAKE A PARTICULAR TEXT SUPERSCRIPT i.e. WRITE THAT PARTICULAR TEST OVER OTHER TEXT JUST LIKE A POWER OF NUMERICAL NUMBER e.g. x3

SYNTAX:-  <sup> …………………………………….. </sup>

EXAMPLE:-

CODING:-

<!DOCTYPE html>

<html>

<head>

<title> IT IS A EXAMPLE OF SUPERSCRIPT TEXT</title>

</head>

<body bgcolor="yellow">

<br><br><br><br><br><br><br><br>

<CENTER>

<p> <b> <font color="red" size=7> NORMAL  <sup> SUPERSCRIPT </sup> </font> </b> </p>

</CENTER>

</body>

</html>

 RESULT:-

 

IN THE ABOVE EXAMPLE AFTER ‘NORMAL’ TEXT ‘SUPPERSCRIPT’ TEXT IS SHOWN.

SIXTH TAG IS SUBSCRIPT <sub> TEXT TAG:-

SOMETIMES WE HAVE TO MAKE A PARTICULAR TEXT SUBSCRIPT i.e. WRITE THAT PARTICULAR TEST UNDER OTHER TEXT JUST LIKE A BASE OF A LOG e.g. H2O WHICH IS THE CHEMICAL SYMBOL OF WATER. HERE THE NUMBER 2 IS SUBSCRIPTED.

SYNTAX:- <sub> ………………………….. </sub>

EXAMPLE:-

CODING:-

<!DOCTYPE html>

<html>

<head>

<title> IT IS A EXAMPLE OF SUBSCRIPT TEXT</title>

</head>

<body bgcolor="PINK">

<br><br><br><br><br><br><br><br>

<CENTER>

<p> <b> <font color="BLUE" size=7> NORMAL  <sub> SUBSCRIPT </sub> </font> </b> </p>

</CENTER>

</body>

</html>

RESULT:-

 

IN THE ABOVE EXAMPLE AFTER ‘NORMAL’ TEXT ‘SUBSCRIPT’ TEXT IS SHOWN.

SEVENTH TAG IS LARGE <big> TAG:-

THE CONTENT INSIDE THE <big>………. </big> IS DISPLAYED ONE FONT SIZE LARGER THAN THE REST OF THE TEXT SURROUNDING IT. IT IS A CLOSED TAG.

SYNTAX:- <big>………. </big>

EXAMPLE:-

CODING:-

<!DOCTYPE html>

<html>

<head>

<title> IT IS A EXAMPLE OF BIG TEXT</title>

</head>

<body bgcolor="PURPLE">

<br><br><br><br><br><br><br><br>

<CENTER>

<p> <b> <font color="YELLOW" size=7> NORMAL TEXT <big>  IT IS A BIG TEXT </big>  </font> </b> </p>

</CENTER>

</body>

</html>

RESULT:-

 

IN THE ABOVE EXAMPLE AFTER ‘NORMAL TEXT’ BIG TEXT ‘IT IS A BIG TEXT’  IS SHOWN.

EIGHT TAG IS SMALL <small> TAG:-

THE CONTENT INSIDE THE <small>………. </small> IS DISPLAYED ONE FONT SIZE SMALLER THAN THE REST OF THE TEXT SURROUNDING IT. IT IS A CLOSED TAG.

SYNTAX:- <small>………. </small>

EXAMPLE:-

CODING:-

<!DOCTYPE html>

<html>

<head>

<title> IT IS A EXAMPLE OF SMALL TEXT</title>

</head>

<body bgcolor="AQUA">

<br><br><br><br><br><br><br><br>

<CENTER>

<p> <b> <font color="RED" size=7> NORMAL TEXT <small> IT IS A SMALL TEXT </small> </font> </b> </p>

</CENTER>

</body>

</html>

RESULT:-

 IN THE ABOVE EXAMPLE AFTER ‘NORMAL TEXT’ SMALL TEXT ‘IT IS A SMALL TEXT’  IS SHOWN.

THE NINGTH TAG IS <div>  TAG TO GETHER SEVERAL ELEMENTS TO CREATE SECTIONS OR SUBSECTIONS OF A PAGE.

SUPPOSE IF ONE WANTS TO MAKE  A GROUP OF COLORS, <div>  TAG MAY  BE USED TO MAKE  GROUP. IT IS A CLOSED TAG.

SYNTAX:-  <div> …………………. </div>

<div> TAG HAS ATTRIBUTES  ‘ID’  AND ‘ALIGN’. “ID’ MAY BE ANY NAME OF THE <div> TAG AND ‘ALIGN’  MAY BE LEFT/MIDDLE/RIGHT.

EXAMPLE:-

CODING:-

<!DOCTYPE html>

<html>

   <head>

      <title>Div Tag Example</title>

   </head>

   <body BGCOLOR="PINK">

      <div id = "COLOUR" align = "middle" >

        <FONT SIZE=7 COLOR="RED"> <P>RED</P> </FONT>

        <FONT SIZE=7 COLOR="YELLOW"> <P>YELLOW</P></FONT> 

         <FONT SIZE=7 COLOR="GREEN"><P>GREEN</P></FONT>

      </div>

<FONT SIZE=7 COLOR="BLUE">

      <div id = "TEXT" align = "left" >

         <h6> MESSAGE</h6>

         <p>THANK YOU ALL OF YOU</p>

      </div>

</FONT>

   </body>

</html>

RESULT:-

 IN THE ABOVE EXAMPLE TWO SECTIONS OF THE PAGE ARE CREATED BY <div> TAG, ONE FOR COLOUR GROUP AND ANOTHER FOR MESSAGE GROUP.

THE TENTH FORMATTING TAG IS <span> TAG WHICH IS USED TO MAKE INLINE GROUPS.

SUPPOSE  IN A PARAGRAPH WE HAVE TO MAKE A GROUP OF SOME WORDS THEN <span> TAG MAY BE USED. IT IS A CLOSED TAG.

SYNTAX:- <span> ………………………………. </span>

IT HAS ATTRIBUTE ‘STYLE’ TO PROVIDE COLOUR OR STYLES.

EXAMPLE:-

CODING:-

<!DOCTYPE html>

<html>

   <head>

      <title>SPAN Tag Example</title>

   </head>

<body BGCOLOR="GREEN">

<br><br> <br><br> <br><br>

<CENTER>

<FONT SIZE=7 COLOR="BLUE">

       <p>WE ARE PROVIDING AN EXAMPLE OF  <span style = "color:red"> SPAN TAG </span>

         TO MAKE A INLINE GROUP OF  <span style = "color:yellow">SPAN TAG </span> </p>

   </body>

</FONT> 

</CENTER>

</html>

RESULT:-

 

IN THE ABOVE EXAMPLE SPAN STYLES <span style = "color:red"> AND <span style = "color:yellow"> TO PROVIDE RED AND YELLOW COLOUR.

IN THE NEXT PART I’II DISCUSS ABOUT OTHER TAGS OF HTML.

 

 

 

 

 

No comments:

HTML-BACKGROUND & COMMENT

               BACKGROUND & COMMENT HTML PAGE CAN BE CHANGED VERY EASILY. BY DEFAULT HTML PAGE IS WHITE. THE PAGE CAN BE DECORATED BY CH...