What is HTML?

HTML stands for Hyper Text Markup Language
It defines the content and structure of a website
It is a markup language

HTML Tags

💡 What are HTML Tags?

HTML tags are used to create HTML documents and render their properties. Each HTML tags have different properties.

💡 What is HTML Element?

The HTML element is everything from the start tag to the end tag:

<tagname>Content goes here...</tagname>

1. The Heading Element

example:-
<h1>Hello World</h1>
----------------------------
Here 
<h1> is a opening tag where as </h1> is a closing tag

-> anything that's inside an angle bracket(< >) is a tag
-> <h1>Hello World</h1> this entire thing is called an element

The heading element ranges from <h1> to <h6>
<h1> is the highest section level whereas <h6> is the lowest section level
1. Paragraph Element

example:-
<p>This is a paragraph.</p>
-------------------------------------
Here
<p> is a opening tag where as </p> is a closing tag

Self Closing Tags

→Horizontal Rule Element
```
 syntax:-
 <hr /> or <hr>
```
→Break Element
```
 syntax:-
 <br /> or <br>
```

The List Elements

→Ordered and Unordered Lists

 Unordered List
 syntax: <ul>
           <li>Milk</li>
           <li>Flour</li>
         </ul>
 Ordered List
 syntax: <ol>
            <li>Milk</li>
            <li>Flour</li>
          </ol>
 nested unordered list
 syntax:<ul>
         <li>Rice</li>
         <li>Flour</li>
         <ul>
             <li>Atta</li>
         </ul>
         <ol>
             <li>aashirwaad</li>
         </ol>
         <li>Milk</li>
     </ul>

The Anchor Element

→It allows us to create Hyperlink(It is used to link from one page to another)

 syntax:-
 <a href="url/src">This is a link</a>
 or we can have global attributes like draggable and set it true which results in the hypertext being draggable.

The Image Element

→It allows us to add images to our website

 syntax:-
 <img src="url/size" alt="image of some sunset"/>
 url followed by the size of the image in pixels

File Path

-> We have two different types of File Path

Relative File Path	Absolute File Path
A relative path describes the location of a file relative to the current (working) directory	An absolute path describes the location from the root directory.

-→In Web Development Relative File Path is more useful :)

Let’s understand Relative File Path with an example

→Here since we want to link a file( i.e anchor.html) that is in the same folder

 a single dot followed by a slash helps us to locate the file

In another example

->Here The file which we want to link is located in another folder

a double dot followed by a slash helps us to locate the desired file(i.e. external.html)

HTML BoilerPlate

What is an HTML Boiler Plate?

A boilerplate in HTML is a template you will add at the start of your project. You should add this boilerplate to all of your HTML pages.

<!DOCTYPE html> //This tag tells the browser which version of the file was written in.
<html lang="en"> // this is the language of the text content in that element.
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> //this keeps our code compatible with Internet Explorer
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> //it tell you the viewport and it defines how the website should be displayed relative to the screen that it's being rendered on.
    <title>Document</title> //this get displayed in the tab bar 
</head>
<body>
    //this is where all of the content of the website goes.
//the text,the titles,the images,the links,everything that you can do with HTML
</body>
</html>

This is the Basic Introduction to HTML we have a few more topics to cover like buttons and etc which we will do as I keep learning :)

Thank you for reading and keep learning :)

Introduction To HTML

Table of contents

What is HTML?

HTML Tags

File Path

HTML BoilerPlate

What is an HTML Boiler Plate?