8.4.Â Block Elements

8.4.1.Â Headings

XHTML has tags to denote headings in
the document at up to six different levels.

The largest and most prominent heading is
h1, then h2,
continuing down to h6.

The element's content is the text of the heading.

ExampleÂ 8.2.Â h1, h2,
and Other Header Tags

Usage:

<h1>First section</h1>
<!-- Document introduction goes here -->
<h2>This is the heading for the first section</h2>
<!-- Content for the first section goes here -->
<h3>This is the heading for the first sub-section</h3>
<!-- Content for the first sub-section goes here -->
<h2>This is the heading for the second section</h2>
<!-- Content for the second section goes here -->

Generally, an XHTML page should have
one first level heading (h1). This can
contain many second level headings (h2),
which can in turn contain many third level headings. Do not
leave gaps in the numbering.

8.4.2.Â Paragraphs

XHTML supports a single paragraph
element, p.

ExampleÂ 8.3.Â p Example

Usage:

<p>This is a paragraph. It can contain just about any
other element.</p>

8.4.3.Â Block Quotations

A block quotation is an extended quotation from another
document that will appear in a separate paragraph.

ExampleÂ 8.4.Â blockquote Example

Usage:

<p>A small excerpt from the US Constitution:</p><blockquote>We the People of the United States, in Order to form
a more perfect Union, establish Justice, insure domestic
Tranquility, provide for the common defence, promote the general
Welfare, and secure the Blessings of Liberty to ourselves and our
Posterity, do ordain and establish this Constitution for the
United States of America.</blockquote>

8.4.4.Â Lists

XHTML can present the user with three
types of lists: ordered, unordered, and definition.

Entries in an ordered list will be numbered, while entries
in an unordered list will be preceded by bullet points.
Definition lists have two sections for each entry. The first
section is the term being defined, and the second section is
the definition.

Ordered lists are indicated by the ol
element, unordered lists by the ul
element, and definition lists by the dl
element.

Ordered and unordered lists contain listitems, indicated
by the li element. A listitem can
contain textual content, or it may be further wrapped in one
or more p elements.

Definition lists contain definition terms
(dt) and definition descriptions
(dd). A definition term can only contain
inline elements. A definition description can contain other
block elements.

ExampleÂ 8.5.Â ul and
ol Example

Usage:

<p>An unordered list. Listitems will probably be
preceded by bullets.</p><ul><li>First item</li><li>Second item</li><li>Third item</li></ul><p>An ordered list, with list items consisting of multiple
paragraphs. Each item (note: not each paragraph) will be
numbered.</p><ol><li><p>This is the first item. It only has one paragraph.</p></li><li><p>This is the first paragraph of the second item.</p><p>This is the second paragraph of the second item.</p></li><li><p>This is the first and only paragraph of the third
item.</p></li></ol>

8.4.5.Â Pre-formatted Text

Pre-formatted text is shown to the user exactly as it is
in the file. Text is shown in a fixed font. Multiple spaces
and line breaks are shown exactly as they are in the
file.

Wrap pre-formatted text in the pre
element.

ExampleÂ 8.7.Â pre Example

For example, the pre tags could be
used to mark up an email message:

<pre> From: nik@FreeBSD.org
To: freebsd-doc@FreeBSD.org
Subject: New documentation available
There is a new copy of my primer for contributors to the FreeBSD
Documentation Project available at
&lt;URL:https://people.FreeBSD.org/~nik/primer/index.html&gt;
Comments appreciated.
N</pre>

Keep in mind that < and
& still are recognized as special
characters in pre-formatted text. This is why the example
shown had to use &lt; instead of
<. For consistency,
&gt; was used in place of
>, too. Watch out for the special
characters that may appear in text copied from a plain-text
source, like an email message or program code.

8.4.6.Â Tables

Mark up tabular information using the
table element. A table consists of one or
more table rows (tr), each containing one
or more cells of table data (td). Each
cell can contain other block elements, such as paragraphs or
lists. It can also contain another table (this nesting can
repeat indefinitely). If the cell only contains one paragraph
then the pelement is not needed.

ExampleÂ 8.8.Â Simple Use of table

Usage:

<p>This is a simple 2x2 table.</p><table><tr><td>Top left cell</td><td>Top right cell</td></tr><tr><td>Bottom left cell</td><td>Bottom right cell</td></tr></table>

A cell can span multiple rows and columns by adding the
rowspan or
colspan attributes with
values for the number of rows or columns to be spanned.

ExampleÂ 8.9.Â Using
rowspan

Usage:

<p>One tall thin cell on the left, two short cells next to
it on the right.</p><table><tr><td rowspan="2">Long and thin</td></tr><tr><td>Top cell</td><td>Bottom cell</td></tr></table>

ExampleÂ 8.10.Â Using
colspan

Usage:

<p>One long cell on top, two short cells below it.</p><table><tr><td colspan="2">Top cell</td></tr><tr><td>Bottom left cell</td><td>Bottom right cell</td></tr></table>

ExampleÂ 8.11.Â Using rowspan and
colspan
Together

Usage:

<p>On a 3x3 grid, the top left block is a 2x2 set of
cells merged into one. The other cells are normal.</p><table><tr><td colspan="2" rowspan="2">Top left large cell</td><td>Top right cell</td></tr><tr>
<!-- Because the large cell on the left merges into
this row, the first <td> will occur on its
right -->
<td>Middle right cell</td></tr><tr><td>Bottom left cell</td><td>Bottom middle cell</td><td>Bottom right cell</td></tr></table>