div and span tags

div and span tags

Both can group elements to create sections or subsections in a web page and they apply style to the group usually by CSS.

<div> tag is used to group block-level elements together. <div> is a block-level element so the div block visually isolates a section of a document on the page, in the same way as a paragraph as example is shown

HTML code

<div id=”menu” align=”middle” >

<a href=”/index.htm”>HOME</a> |

<a href=”/contact.htm”>CONTACT</a> | <a href=”/about.htm”>ABOUT</a>

</div>

Browser output

 The div and span Tags

<span> tag is used to group inline elements only. <span> is an inline element so it groups inline tags only as example is shown

HTML code

<div><p>This is in div and <span style=”color:green”> this in span tag</span> enclosing it</p></div>

Browser output

 The div and span Tags 2

Both tags have all the universal and UI event attributes. Usually class attribute is used along with div or span tags.

Share this post
[social_warfare]
Html Block and Inline Elements
HTML5 new structure and inline elements

Get industry recognized certification – Contact us

keyboard_arrow_up