Current Assignment(s)

A5: Multimedia
Due: Recommended by Monday, 5.28

The <span> Element

The span element is the inline equivalent of the <div> element.

stacked building blocks with stickers representing span elements

This means that spans can exist within divs, and do not create blocks. It serves to identify or group content together that requires organization or extra styling. You can have multiple span elements inside a div.

One specific use for the <span> element is to identify text that needs to appear visually unique on the rendered HTML page.

As with the <div> element, the <span> element should include a class or ID attribute to provide:

  • a reference to styling code
  • and/or information to developers about the inner content
HTML
<div id="long-blue" class="long-block">
  <p>A block with a <span class="circle">circle</span> and <span class="triangle">triangle</span> on it.</p>
</div>

<div id="long-red" class="long-block">
  <p>A block with a <span class="circle">circle</span> on it.</p>
</div>