Span Tag


Span Tag

A Span Element can be added to accent a paragraph tag, a heading tag, a link, and other tags.  To use a span element:

  1. Begin with an html tag – for example: heading tag.
  2. Add the <span style =
  3. Place in the styles that you would like to be displayed
  4. Add the text to be associated with the style
  5. Close the span tag.
  6. Continue with the the html tag.

 

See the Pen Span element by jhoffmanbcc (@jhoffmanbcc) on CodePen.

Note:  Notice how the Span style is utilized within another tag.


A Span Class can be utilized many times.  In this example:

  1. Create a span class.
  2. Name the span class
  3. Reference the span class in the CSS document with a div. then the name of the class
  4. Add { curly braces }
  5. Place your CSS style within the curly braces.

See the Pen Span Class by jhoffmanbcc (@jhoffmanbcc) on CodePen.

Note:  Be sure to click on the CSS tab in the Codepen example to view the style code.  Notice how the Span Class is utilized within another tag

Questions