# 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.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1769721520312/264372aa-7b5d-4eeb-aec6-5aa74618c88d.png align="center")

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 `< >`.

```xml
<p>
<h1>
<div>
```

## Opening Tag, Closing Tag, and Content

Most HTML tags come in pairs.

```xml
<p>I am the best</p>
```

Let’s break this down:

* `<p>` → Opening tag
    
* `</p>` → Closing tag
    
* `I am the best` → Content
    

Together, they form a meaningful unit.

Some of the tags are self-closing, like

```xml
<br/>
```

### What Is an HTML Element?

HTML Element= Opening Tag + Content + Closing tag

So this:

```xml
<p>This is a car</p>
```

### Block-Level vs Inline Elements

HTML elements are broadly divided into two types.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1769722587297/8d6a419c-1ea9-42e6-a008-4d104206e726.png align="center")

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1769722618026/d745cdd7-86a2-43ae-88d4-3464caf33eeb.png align="center")

### Block-Level Elements

* Take the **full width**
    
* Start on a **new line**
    

```xml
<div>
<p>
<h1>
```

### Inline Elements

* Take **only the required space**
    
* Stay in the **same line**
    

```xml
<span>
<a>
<strong>
```

### Commonly used HTML tags

Below are some commonly used HTML Tags

```xml
<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**.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1769722307847/25cc1301-851b-4ec0-8c5e-0cfd60659282.png align="center")

You’ll see:

* HTML elements
    
* Nested structure
    
* How browsers actually read your code
    

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1769722384625/2bcd8e64-1923-4010-8391-8d8fa3aa3b42.png align="center")

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!**