In this chapter, we will learn all html basic tags that are the backbone of html language along with html interview questions and practice exercise.
-
Heading Tag :
Any document is incomplete without proper headings. In a html webpage, heading tags are represented by <h1>, <h2>, <h3>, <h4>, <h5> and <h6>. Where h1 is the most bigger in size and h6 is smallest. Example is explained below:
<!DOCTYPE html> <html> <title> Heading Example </title> <body> <h1>Heading 1</h1> <h2>Heading 2</h2> <h3>Heading 3</h3> <h4>Heading 4</h4> <h5>Heading 5</h5> <h6>Heading 6</h6> </body> </html> |
The result will be displayed as follows
This is heading 1This is heading 2This is heading 3This is heading 4This is heading 5This is heading 6 |
-
Paragraph Tag:
Paragraph tags are used to add paragraphs in a document. Where, opening tag is written like <P> and closing tag is written like </P>. Example of paragraph tag is explained below:
<!DOCTYPE html> <html> <heading> <title> Paragraph Example </title> </heading> <body> <p>First Paragraph</p> <p>Second Paragraph</p> <p>Third Paragraph</p> </body> </html> |
The result will be displayed as
First Paragraph Second Paragraph Third Paragraph |
-
Line Break Tag:
We use line break tag to start a new line in a html webpage. Unlike other html tags, they doesn’t require a closing tag and is written like <br />. The line break tag has a space after br followed by forward slash (/). Example of line break tag is explained below:
<!DOCTYPE html> <html> <heading> <title> Line Break Example </title> </heading> <body> <p>Hi, <br />How are you. <br />Regards <br />XYZ</p> </body> </html> |
The result will be displayed as
Hi, |
-
Center Alignment Tag:
We use center alignment tags to center align any tex in html web page. Opening tag is written like <Center> and a closing tag is written like </Center>. Example is explained below:
<!DOCTYPE html> <html> <heading> <title> Center alignment example </title> </heading> <body> <p>Text not in Center</p> <p> <center>Text in Center </center></p> </body> </html> |
The result will be displayed as:
Text not in Center |
-
Link Tag:
We use link tags to add a link of an other webpage. Opening and closing tags are represented like <a> and </a>. Example of link tag is explained below:
<!DOCTYPE html> <html> <heading> <title> Link Tag example </title> </heading> <body> <a href=”http://freetutorialpoint.com”>This is a link</a> </body> </html> |
The result will be displayed as:
|
Chapter Summary:
- Use <h1>, <h2> …..<h6> tags to add heading to a page.
- Use <p> tag to add paragraphs.
- Use <br /> tag to start a new line.
- Use <centre> tag to centre alignment any text.
- Use <a> tag to insert a linkl.
Interview question:
- Do we have to type all tags in lower case only?
It doesn’t make any difference weather you type tags in upper case or lower case. But however, some of the browsers doesn’t support upper case tags. So an ideal practice should be to write them in lower case only.
Practice Exercise:
<!DOCTYPE html> <html> <heading> <title>Practice Exercise</title> </Heading> <body> <p>Hello, Learn free html at www.freetutorialpoint.com</p> </body> </html> |
In above html code:
- Add a heading ‘HTML Tutorial’ to the above html page.
- Break text at ‘Hello’.
- Center align all paragraph text.
- Add a link to text www.freetutorialpoint.com.
Click here to practice above exercise in real time HTML code editor |
---|
HTML headings are created with the h tag. After the h we place a number to specify which level of heading it is.