Basic Concepts - CSS Reference - page 10

Element Classification
Broadly speaking, CSS groups elements into two types: nonreplacedand replaced. Although
the types may seem rather abstract, there actually are some profound differences in how the
two types of elements are presented. These differences are explored in detail in Chapter 7 of
CSS: The Definitive Guide , third edition (O'Reilly).
Nonreplaced Elements
The majority of HTML and XHTML elements are nonreplacedelements, which means their
content is presented by the user agent inside a box generated by the element itself. For ex-
ample, <span>hi there</span> is a nonreplaced element, and the text hi there will be
displayed by the user agent. Paragraphs, headings, table cells, lists, and almost everything else
in HTML and XHTML are nonreplaced elements.
Replaced Elements
In contrast, replacedelementsare those whose content is replaced by something not directly
represented by document content. The most familiar HTML example is the img element,
which is replaced by an image file external to the document itself. In fact, img itself has no
actual content, as we can see by considering a simple example:
<img src="howdy.gif" alt="Hi">
There is no content contained in the element—only an element name and attributes. Only by
replacing the element's lack of content with content found through other means (in this case,
loading an external image specified by the src attribute) can the element have any presenta-
tion at all. Another example is the input element, which may be replaced with a radio button,
checkbox, or text input box, depending on its type. Replaced elements also generate boxes in
their display.