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.

Html Block and Inline Elements
HTML5 new structure and inline elements

Get industry recognized certification – Contact us

keyboard_arrow_up
Open chat
Need help?
Hello 👋
Can we help you?