Learn Java, Angular, SQL with Coding Exercises & Career Tips

Div tag in HTML

The <div> tag in HTML stands for 'division'. It is one of the most commonly used elements in web development. This tag acts as a container that helps in grouping together different HTML elements so that you can style or manage them as a single unit using CSS or JavaScript.

Key Features of <div>

It is a block level element meaning it starts on a new line and stretches to fill the full width.
It does not add any styling by default It is purely a container.
Useful for layout, styling multiple elements or adding interactivity with JavaScript.
Helps organize code and make your HTML more readable.

When to Use <div>

To group multiple elements like text, images or buttons.
To apply common styles or class selectors to a set of elements.
For page layout structure along with CSS (like grid or flexbox).

Example:

<!DOCTYPE html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Div Example</title>
 </head>
 <body>
  <div style="border:1px solid red; padding:20px; font-size:20px;">
   <p>Welcome to Quipoin</p>
   <p>This is a paragraph</p>
  </div>
 </body>
</html>

Output:

Tips

For semantic HTML, try using tags like <section>, <article> or <main> if they better describe your content.
Use CSS classes instead of inline styles for cleaner code.