By: Mr. Anoop Kumar Tiwari

HyperText Markup Language By: Mr. Anoop Kumar Tiwari

Structure of HTML- <html> <head><title>Index</title></head> <body> Here type your information or document that you want to look on the Web page. </body> </html>

Use of Bold (<B>) Tag. • <b> Hyper Text Markup Language </b> Hyper Text Markup Language

Use of Italic (<I>) Tag. • <i> Hyper Text Markup Language </i> Hyper Text Markup Language

Use of Underline (<U>) Tag. • <u> Hyper Text Markup Language </u> Hyper Text Markup Language

To give background colour • <Body bgcolor=“red”> This is the background color of the WEB PAGE….

To add a picture in the background of the Web Page. • <body background=“C:\Documents and Settings\Documents\My Pictures\Sunset.jpg”> We are able to type upon this picture.

To give the default colour to the text in the WEB Page. • <Body text=“blue”> BEFORE : Hyper Text Markup Language AFTER: Hyper Text Markup Language Hyper Text Markup Language

To change the font colour- • <font color=“green”> • As: Hyper Text <font color=“green”>Markup Language. Hyper Text Markup Language Note: Here default colour of the text is BLUE as we had done before.

To change the type of any FONT: • <font face=“Arial”> This is in Arial Font</font> This is in Arial Font.

To change the Size of the TEXT- • <font size=“10”>This is in size 10</font> Before: This is in normal form. After: This is in size 10.

Can we use all the attributes in a tag?Ans: Yes. <font color=yellow face=Arial size=10> All the attributes had used in a tag like this….

To draw a line on the Web Page- • <hr> is used to draw a simple line. • <hr noshade> is used to draw a solid line.

To change the size & color of <hr>- • <hr color=“red”> • <hr size=“5”> • <hr color=red size=5>

To change the width of <HR>.. • <hr width=“200”> • Where as <hr> will show a complete line- • We can use all the attributes of <hr> tag as-<hr size=10 color=red width=200 noshade>

We can also add Headings in Web Pages- HTML HTML HTML HTML HTML HTML • There are 6 Levels of headings by default- <h1> HTML</h1> <h2> HTML</h2><h3> HTML</h3><h4> HTML</h4> <h5> HTML</h5><h6> HTML</h6>

Use of Subscript & Superscript- In H2O‘2’ is in Subscript form, we shall use <Sub> Tag InA2 ‘2’ is in Superscript form, we will use <sup> tag. We shall write A2 like this: • We shall write H2O like this: A<sup>2</sup> H<sub>2</sub>O

We can create lists in HTMl- There is two types of lists in HTML: Ordered List Unordered list It does not show any order of sequence. Order List may be in following kinds- Disc ( ) Circle ( ) Square( ) • It shows an order of sequence. • Order List may be in following kinds- • 1, 2, 3, 4, 5, ………… • A, B, C, D, E, ………. • a, b, c, d, e, ……….. • I, II, III, IV, V, ………. • i, ii, iii, iv, v, ………..

Another list in the list Nested List: Coding Output <html> <head><title>Nested List</title><head> <body><ol>Tags <li>Physical Tags</li> <ul><li>Bold</li> <li>Italic</li></ul> <li>Logical Tag</li> <ul><li>Emphasis</li> <li>Strong</li></ul></ol> </body> </html> Physical Tag • Bold • Italic Logical Tag • Emphasis• Strong

Table in HTML OUTPUT Name Class CODEs in HTML <table> <tr> <td>Name</td> <td>Class</td> </tr> <table>

Use of <TR>,<TD>&<TH> • TRFor creating a new row in the table • TDFor creating a new cell in the row of the table • THFor creating a Heading in the row of the table

Use of Border Attribute OUTPUT HTML CODE <table border><tr><th>Name</th> <th>Class</th> <th>Address</th></tr> <tr><td>Aditya</td> <td>10</td> <td>Sikandrabad</td> </tr> <table>

Use of “WIDTH” and HEIGHT” Attribute <table height=“50%” width=“50%” border> <tr> <td> Name</td><td>Class</td><td>Address </td> </tr> <tr> <td> Aditya</td><td>10</td><td> Sikandrabad </td> </tr> <tr> <td> Akash</td><td>10</td><td> Khurja </td> </tr> <tr> <td> Ajay</td><td>10</td>Ghaziabad </td> </tr> </table>

By: Mr. Anoop Kumar Tiwari