HTML Structure

Basic Structure of HTML

HTML (Hypertext Markup Language) is the standard language used to create web pages. It is a markup language, which means that it uses a set of tags and attributes to define the structure and layout of a web page. HTML Structure

The basic structure of an HTML document includes the following elements:

  1. <!DOCTYPE>: This is the document type declaration and is used to specify the version of HTML being used.
  2. <html>: This is the root element of an HTML document, and all other elements are contained within it.
  3. <head>: This element contains information about the document such as the title, meta data, and links to CSS and JavaScript files.
  4. <title>: This element contains the title of the document, which is displayed in the browser’s title bar or tab.
  5. <body>: This element contains the visible content of the web page, such as text, images, and links.
  6. <header>: This element contains the introductory content or a set of navigational links.
  7. <nav>: This element contains a section of a page that contains navigation links.
  8. <main>: This element contains the main content of a document.
  9. <article>: This element contains a self-contained composition in a document, such as a forum post or a magazine or newspaper article.
  10. <section>: This element defines a section in a document, such as chapters, headers, footers, or any other sections of the document.
  11. <aside>: This element contains content that is related to the main content but can be considered separate from it.
  12. <footer>: This element contains the content at the end of a document, such as links, copyright information, and contact information.
  13. <p>: This element is used to define a paragraph of text.
  14. <a>: This element is used to create hyperlinks that allow users to navigate between web pages.
  15. <img>: This element is used to embed images in a web page.

These are just some of the basic elements that are used in an HTML document, and there are many more tags available for creating more complex layouts and adding multimedia and interactive elements to a web page.

Example:

<!DOCTYPE html>
<html>
<head>
    <title>Fullstackadda</title>
</head>
<body>

    <h1>Heading</h1>
    <p>paragraph.</p>

</body>
</html>

OUTPUT:

html structure

Example 2:

Here is an example of HTML code for a header and footer:

Header:

<!DOCTYPE html>
<html>
  <head>
    <title>My Website</title>
  </head>
  <body>
    <header>
      <nav>
        <ul>
          <li><a href="#home">Home</a></li>
          <li><a href="#about">About</a></li>
          <li><a href="#contact">Contact</a></li>
        </ul>
      </nav>
    </header>

Footer:

    <footer>
      <p>Copyright ©2022 My Website</p>
    </footer>
  </body>
</html>

Detailed Description about Tags

Sr.NoTag & Description
1<!DOCTYPE…>This tag defines the document type and HTML version.
2<html>This tag encloses the complete HTML document and mainly comprises of document header which is represented by <head>…</head> and document body which is represented by <body>…</body> tags.
3<head>This tag represents the document’s header which can keep other HTML tags like <title>, <link> etc.
4<title>The <title> tag is used inside the <head> tag to mention the document title.
5<body>This tag represents the document’s body which keeps other HTML tags like <h1>, <div>, <p> etc.
6<h1>This tag represents the heading.
7<p>This tag represents a paragraph.
.

HTML Structure HTML Structure