HTML Div Tag

HTML Div Tag

HTML Div Tag

  • The <div> element is a block-level element.

  • A block-level element always starts on a new line and takes up the full width available (stretches out to the left and right as far as it can).

    • Example of block level element: <p>,<h1>,<h2> etc.

  • HTML div tag does not give any special appearance on a web page, like h1 tag, p tag etc gives. It generally used as a container for HTML elements.

    • Just like if we want to change the color of 3 HTML elements together then we can use a div tag to cover all HTML elements in one.

Example:

<div style="color:red">
<h1>First item</h1>
<h3>Second item</h3>
<p>Third item</p>
</div>

Example:

<div style="background-color:lightblue">
<p>First item</p>
<p>Second item</p>
<p>Third item</p>
</div>

Example:

<div style="text-align:right; background-color:lightblue;">
<a href="#">HOME</a> | <a href="#">CONTACT</a> | <a href="#">ABOUT</a>
</div>