Tuts Master 😉

HTML – Structure of HTML With Example

html structure

Before going to write codes of HTML, you should know the structure of HTML, without knowing the structure it’s impossible to write HTML codes.

You may get confused while writing codes and tags if you don’t know the structure so first of all, it’s better to know the structure of the HTML.

In below example, you can see the first line <!DOCTYPE html>. That indicates it’s is the HTML document.

After that you have to go for basic and important tag it’s <html> start tag and </html> end tag.

You always have to take care of start tag and end tag. The start and end HTML tags are the most important… Don’t forget to write those tags on HTML documents.

After that, you have to go for <head></head> where you can write code to decorate your HTML documents. Inside that you can even write <title></title> it’s the title of your HTML documents.

Finally, it’s the <body></body> here you can write the visible content, means which you want to show on your web page.

<!doctype html>
<html>
         <head>
                     <title>......</title>
         </head>
         <body>
                    <h1> Hello World!</h1>
                    <p> Hope all are fine</p>
        </body>
</html>
  1. DOCTYPE defines the type of the document.
  2. <HTML> and </HTML> defines the format of the webpage.

Head Element

The <head> element contains information about the document, which is not displayed on the main page itself. 

  1. In between <HEAD> and </HEAD> tag we can define the decoration codes like CSS, JavaScript etc. Its content will not appear in a web browser, It’s effect will appear.
  2. In between <TITLE> and </TITLE> tag that text will be the title of the web page it will appear on the title bar of the browser.

Body Element

The <body> element holds the actual content of the page that is viewed in your browsers. 

  1. The tax between <BODY> and </BODY> tag will appear in the body of the web browser. It is the visible content. 
  2. <H1> and </H1> tag display the text in heading format, a bit larger than other text.
  3. <P> and </P> display the paragraph in body.

The basic distinction between tags and elements is very important to understand; A tag is made up of a left and right- angle bracket and letters and numbers between those brackets, whereas elements are the opening and closing tags plus anything between the two tags.

In