Currently set to Index
Currently set to Follow
Lagos, Nigeria
info@ezefidelity.com

The HTML div Tag.

The HTML div Tag post thumbnail

The HTML <div> tag is used by most web developers to markup several contents in a webpage. This is because the <div> tag is a generic element. That is, it is a general purpose tag.

Because the HTML <div> tag is generic, it does not really add any value to the HTML semantic of the webpage. Thus, it is advisable to use it as:

  • A last resort. When there seems to be no other HTML tag for marking up a webpage content.
  • As a means for grouping multiple page contents in order to apply styles to them using CSS.

See also: Explanation on HTML Semantics.

How to use the HTML <div> Tag

The HTML <div> Tag has both opening and closing tags.

The HTML <div> tag like every other tag has both the opening and the closing tag.
The Opening tag <div> specify the beginning, while the closing tag </div> specify the end of the tag.
Example:

<div>
 <h1> This is a header level 1 tag </h1>
  <p> This is a paragraph tag </p>
</div>

The <div> Tag is a Block Level Tag.

What this means is that, it usually occupy the full width of the section it appears in, regardless of the content of the page, it is marking up.
Example:

Click on the Run Pen to view the result. Then on the HTML tab to view the code.

<div> Tag Attributes

The HTML <div> tag does not have an attribute that works only when it is used with the <div> tag. Rather, it accepts all HTML Global Attributes.

<div> Tag Event Handlers

The HTML <div> tag does not have an event handler attribute that works only when it is used with the <div> tag. Rather, it accepts all HTML event handlers attributes.

See also: How to Lazy Load Website Contents with HTML.

<div> Tag Names

Name can be assigned to a <div> tag using either the ID or Class attributes, so that it can be styled with CSS, or a script can be written for it using JavaScript.
Example:

Click on the Run Pen to view the result. Then on either the HTML or CSS tab to view the code.



Do you find this article helpful? Your Friend might too. So, please Share it with them using the Share button above.
Will you like to get notified when I post new updates? Then Follow me on any of my social media handles: Google News, Telegram, WhatsApp, Twitter, Facebook, Pinterest.
You can also drop your email address below if you wish to be notified by mail.


Tags: , ,

%d bloggers like this: