HTML Tutorial Part-3: Headings, Paragraphs and Lists

HTML Tutorial Part-3: Headings, Paragraphs and Lists

What are HTML body tag Elements?

Image

How the data is displayed on the body of the browser is determined by the HTML body tag element. And it sits right next to the </head> tag. And all tags in the <body> </body> of html are body tag elements. Below the html body tag, the tags are described in the form of categories.

What are the body tag elements in HTML?

HTML body tag elements are divided into 12 parts:

  1. Heading Tag Elements
  2. Paragraph Tag Elements
  3. List Tag Elements
  4. Link Tag Element
  5. Image Tag Element
  6. Text Formatting Tag Elements
  7. Layout Tag Elements
  8. Iframe Tag element
  9. Table Tag Elements
  10. Form Tag Elements
  11. Block Tag Elements

So let’s first discuss the Heading Element:

Heading Tag Element

The Heading Tag is used to write the title of a document or paragraph in HTML. There are six types of heading tags in HTML: <h1> </h1>, <h2> </h2>, <h3> </h3>, <h4> </h4>, <h5> </h5> and <h6> </h6>. If the title needs to be written in capital letters, it is written in the middle of the <h1> </h1> tag. And if you use the other ones, the writing size will gradually get smaller. See the following example:

Image

Output:

Image

Paragraph Tag Element

Any document is written in one or more paragraphs. <p> or paragraph tags are used to create paragraphs in HTML. E.g. <p> This is a paragraph. </p> When each paragraph is displayed through the browser, a line break is created after each paragraph. If a line break is ever needed within a paragraph, the <br /> tag is used at the end of the line. See the following example:

Image

Output:

Image

But you

without using tags

You can also use tags. See the following example:

Image

Output

Image

It is used a lot like a line of poetry.

 List Tag Element

We sort through our daily routine. In the same way, listing is one of the best ways to organize the content of a web page and present its information. There are three types of lists that can be created through HTML, one is Order List, the second is Un-Order List and the third is definition List. The Order List presents various information in chronological order and has a serial number at the beginning of each line. On the other hand, in Un-Order List, there are many types of lists with small round or square marks in front of each line. And with the definition list, the definitions of different subjects are arranged in the form of list. HTML uses the <ul> </ul> tag to create an Un-Order List and the <ol> </ol> tag to create an Order List. And <dl> </dl>, <dt> and <dd> </dd> are used to create the definition list. So first let’s look at an example of an un-order list:

Image

Open a notepad, type the code above and click Save as from the file menu. File name: index.html, Save as type: All files, save with index.html If you open the file with any web browser, it will look like the image shown below.

Output:

Image

Let us see an example of Order list:

Image

Open a notepad, type the code above and click Save as from the file menu. File name: index.html, Save as type: All files, save with index.html If you open the file with any web browser, it will look like the image shown below.

Image

Let us see an example of Definition list:

Image

Open a notepad, type the code above and click Save as from the file menu. File name: index.html, Save as type: All files, save with index.html If you open the file with any web browser, it will look like the image shown below.

Result

Image

Leave a Reply

Your email address will not be published. Required fields are marked *