Applying Styles with Span or Div Elements

Div (division) , a container element, is used to apply styles without denoting a specific xhtml element(tag). Div is a block-level element which can contain any HTML tag or groups of tags and apply styles with additional spaces above and below the div tag. It can be assigned a CLASS or ID identified in the style sheet.

This teal style was applied using the div block element.

<div class="teal">The teal statement</div> The closed div stops the teal formatting therefore there is a line break before and after the text.

Using Span- Inline Styles

Span is an inline element used to format a portion of text within a paragraph without additional spaces around the text. The text has a word in the paragraph is red with no line breaks.

<span class="red">Red Text</span>
Style Sheet Classes, IDs and Special Elements
. perioddefines classes
# defines IDs
divblock level container element
spaninline container element
 
Define Classes and IDs
Div and Span Elements
Pseudo Classes
Background Images
 Drop Caps
Drop Shadow
Display Attributes
Background-Attachment

Web Design with XHTML Part II
Doris Cuffey, Instructor