Understanding HTML Tags and Elements
Hey Everyone,
Before CSS makes things look good and JavaScript makes things interactive, HTML gives structure to a webpage.
So, in this blog we will be understanding HTML tags and elements
Let’s start from the ground up.
What HTML is and why we use it
HTML stands for HyperText Markup Language.
HTML is not a programming language.
It is a markup language used to describe the structure of a webpage.
From the above image, you can see that
HTML is like the skeleton of your website
CSS is the Skin
JavaScript is the brain
In this blog, we will be focusing on HTML
HTML tells the browser that:
This is a heading
This is a paragraph
This is a button
This is an image
What Is an HTML Tag?
An HTML tag is a keyword wrapped inside angle brackets < >.
<p>
<h1>
<div>
Opening Tag, Closing Tag, and Content
Most HTML tags come in pairs.
<p>I am the best</p>
Let’s break this down:
<p>→ Opening tag</p>→ Closing tagI am the best→ Content
Together, they form a meaningful unit.
Some of the tags are self-closing, like
<br/>
What Is an HTML Element?
HTML Element= Opening Tag + Content + Closing tag
So this:
<p>This is a car</p>
Block-Level vs Inline Elements
HTML elements are broadly divided into two types.
Block-Level Elements
Take the full width
Start on a new line
<div>
<p>
<h1>
Inline Elements
Take only the required space
Stay in the same line
<span>
<a>
<strong>
Commonly used HTML tags
Below are some commonly used HTML Tags
<p>Hello, My name is Abhi</p>
<a href=""></a>
<img src="" alt=""/>
<br/>
<h1></h1>
<span></span>
Inspect HTML in the Browser
Right-click on any webpage and click on Inspect.
You’ll see:
HTML elements
Nested structure
How browsers actually read your code
This inspection habit will help you get comfortable with HTML.
And now, you understand the basics of HTML tags and elements.
If you have any doubts or want to connect, feel free to drop a comment — I’d be happy to help.
Thanks for reading, and see you in the next blog!
Peace ✌️ and Happy Learning!
