HTML <span> tag

The <span> tag is used to set apart a small section of text (usually one or two words) in a webpage for the purpose of applying a unique style to that text.

This tag has no attributes specific to it.

Read more about the <span> tag as well as the <div> tag at our HTML div and span tags page.

Standard attributes

class, dir, id, lang, style, title, xml:lang

For more information on standard attributes, check out our HTML standard attributes reference page.

Event attributes

onclick, ondblclick, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup, onkeydown, onkeypress, onkeyup

For more information on event attributes, check out our HTML event attributes reference page.

Example

<p> There are so many colors to choose from when building webpages. You have <span style="color: green;">green</span>, <span style="color: blue;">blue</span>, <span style="color: orange;">orange</span>, <span style="color: gray;">gray</span>, and <span style="color: #2d6838; font-weight:bold;">much more</span>. </p>
Output:
There are so many colors to choose from when building webpages. You have green, blue, orange, gray, and much more.

Tips & notes

Don't overuse the <span> tag. This tag is meant to emphasize a few important words here and there, not entire paragraphs or pages. Use the <span> tag rarely, only when you want to emphasize a little bit of text.

You can apply styles to text within a <span> tag by using an internal, external, or inline style definition (in the above example we used an inline style definition). Learn all about applying styles at our CSS section.

Web Reference
  1. CSS reference
  2. RSS reference
  3. HTML reference


© Copyright 2011-2012 Landofcode.com
Terms of use | Privacy policy | Copyright information | Make a donation