The P element is used to markup paragraphs. It is a
container and requires a start tag. The end tag is optional as it can
always be inferred by the parser. User agents should place paragraph
breaks before and after P elements. The rendering is user
agent dependent, but text is generally wrapped to fit the space
available.
Example:
<P>This is the first paragraph.
<P>This is the second paragraph.
Paragraphs are usually rendered flush left with a ragged right
margin. The ALIGN attribute can be used to explicitly
specify the horizontal alignment:
- align=left
- The paragraph is rendered flush left.
- align=center
- The paragraph is centered.
- align=right
- The paragraph is rendered flush right.
For example:
<p align=center>This is a centered paragraph.
<p align=right>and this is a flush right paragraph.
The default is left alignment, but this can be overridden by an
enclosing DIV or
CENTER element.
List items can contain block and text level items, including
nested lists, although headings and address elements are excluded.
This limitation is defined via the %flow entity.
Unordered lists take the form:
<UL>
<LI> ... first list item
<LI> ... second list item
...
</UL>
The UL element is used for unordered lists. Both start
and end tags are always needed. The LI element is used for
individual list items. The end tag for LI elements can
always be omitted. Note that LI elements can contain nested
lists. The COMPACT attribute can be used as a hint to the
user agent to render lists in a more compact style.
The TYPE attribute can be used to set the bullet style
on UL and LI elements. The permitted values
are "disc", "square" or "circle". The default generally depends on the
level of nesting for lists.
- with <li type=disc>
- with <li type=square>
- with <li type=circle>
This list was chosen to cater for the original bullet shapes used by
Mosaic in 1993.
Ordered (i.e. numbered) lists take the form:
<OL>
<LI> ... first list item
<LI> ... second list item
...
</OL>
The OL START attribute can be used to
initialize the sequence number (by default it is initialized to 1).
You can set it later on with the VALUE attribute on
LI elements. Both of these attributes expect integer
values. You can't indicate that numbering should be continued from a
previous list, or to skip missing values without giving an explicit
number.
The COMPACT attribute can be used as a hint to the user
agent to render lists in a more compact style. The OL
TYPE attribute allows you to set the numbering style for
list items:
| Type | Numbering style
|
|---|
| 1 | Arabic numbers | 1, 2, 3, ...
| | a | lower alpha | a, b, c, ...
| | A | upper alpha | A, B, C, ...
| | i | lower roman | i, ii, iii, ...
| | I | upper roman | I, II, III, ...
|
Definition lists take the form:
<DL>
<DT> term name
<DD> term definition
...
</DL>
DT elements can only act as containers for text level
elements, while DD elements can hold block level elements
as well, excluding headings and address elements.
For example:
<DL>
<DT>Term 1<dd>This is the definition of the first term.
<DT>Term 2<dd>This is the definition of the second term.
</DL>
which could be rendered as:
- Term 1
- This is the definition of the first term.
- Term 2
- This is the definition of the second term.
The COMPACT attribute can be used with the
DL element as a hint to the user agent to render
lists in a more compact style.
These elements have been part of HTML from the early days. They are
intended for unordered lists similar to UL elements. User
agents are recommended to render DIR elements as
multicolumn directory lists, and MENU elements as single
column menu lists. In practice, Mosaic and most other user agents
have ignored this advice and instead render DIR and
MENU in an identical way to UL elements.
The PRE element can be used to include preformatted
text. User agents render this in a fixed-pitch font, preserving spacing
associated with white space characters such as space and newline
characters. Automatic word-wrap should be disabled within
PRE elements.
Note that the SGML standard requires that the parser
remove a newline immediately following the start tag
or immediately preceding the end tag.
PRE has the same content model as paragraphs,
excluding images and elements that produce changes in font size,
e.g. IMG, BIG, SMALL,
SUB, SUP and FONT.
A few user agents support the WIDTH attribute. It
provides a hint to the user agent of the required width in characters.
The user agent can use this to select an appropriate font size or to
indent the content appropriately.
Here is an example of a PRE element; a verse from
Shelley (To a Skylark):
<PRE>
Higher still and higher
From the earth thou springest
Like a cloud of fire;
The blue deep thou wingest,
And singing still dost soar, and soaring ever singest.
</PRE>
which is rendered as:
Higher still and higher
From the earth thou springest
Like a cloud of fire;
The blue deep thou wingest,
And singing still dost soar, and soaring ever singest.
The horizontal tab character (encoded in Unicode, US ASCII and
ISO 8859-1 as decimal 9) should be interpreted as the smallest
non-zero number of spaces which will leave the number of characters
so far on the line as a multiple of 8. Its use is strongly discouraged
since it is common practice when editing to set the tab-spacing to other
values, leading to misaligned documents.
These are obsolete tags for preformatted text that predate the
introduction of PRE. User agents may support these
for backward compatibility. Authors should avoid using them in new
documents!
DIV elements can be used to structure HTML documents as
a hierarchy of divisions. The ALIGN attribute can be used
to set the default horizontal alignment for elements within the content
of the DIV element. Its value is restricted to
LEFT, CENTER or RIGHT, and is
defined in the same way as for the paragraph element
<P>.
Note that because DIV is a block-like element it will
terminate an open P element. Other than this, user agents
are not expected to render paragraph breaks before and after
DIV elements. CENTER is directly equivalent
to DIV with ALIGN=CENTER. Both
DIV and CENTER require start and end tags.
CENTER was introduced by Netscape before they added
support for the HTML 3.0 DIV element. It is retained in
HTML 3.2 on account of its widespread deployment.
This is used to enclose block quotations from other works.
Both the start and end tags are required. It is often rendered
indented, e.g.
They went in single file, running like hounds on a strong scent,
and an eager light was in their eyes. Nearly due west the broad
swath of the marching Orcs tramped its ugly slot; the sweet grass
of Rohan had been bruised and blackened as they passed.
from "The Two Towers" by J.R.R. Tolkien.
This is used to define an HTML form, and you can have more than one form
in the same document. Both the start and end tags are required.
Forms can contain a wide range of HTML markup including several
kinds of form fields such as single and multi-line
text fields, radio button groups, checkboxes, and menus.
- action
- This specifies a URL which is either used to post forms via email,
e.g. action="mailto:foo@bar.com", or used to invoke a
server-side forms handler via HTTP, e.g.
action="http://www.acme.com/cgi-bin/register.pl"
- method
- When the action attribute specifies an HTTP server, the method
attribute determines which HTTP method will be used to send the form's
contents to the server. It can be either GET or
POST, and defaults to GET.
- enctype
- This determines the mechanism used to encode the form's contents.
It defaults to application/x-www-form-urlencoded.
Further details on handling forms are given in RFC 1867.
HR - horizontal rules
Horizontal rules may be used to indicate a change in topic.
In a speech-based user agent, the rule could be rendered as a pause.
HR elements are not containers so the end tag is forbidden.
The attributes are: ALIGN, NOSHADE,
SIZE and WIDTH.
- align
- This determines whether the rule is placed at the left, center
or right of the space between the current left and right margins
for align=left, align=center or
align=right respectively. By default, the rule is centered.
- noshade
- This attribute requests the user agent to render the rule in a
solid color rather than as the traditional two colour "groove".
- size
- This can be used to set the height of the rule in pixels.
- width
- This can be used to set the width of the rule in
pixels (e.g. width=100) or as the percentage between the
current left and right margins (e.g. width="50%"). The
default is 100%.
HTML 3.2 includes a widely deployed subset of the specification
given in RFC 1942 and can be used to
markup tabular material or for layout purposes. Note that the latter
role typically causes problems when rending to speech or to text
only user agents.
Tables take the general form:
<TABLE BORDER=3 CELLSPACING=2 CELLPADDING=2 WIDTH="80%">
<CAPTION> ... table caption ... </CAPTION>
<TR><TD> first cell <TD> second cell
<TR> ...
...
</TABLE>
The attributes on TABLE are all optional. By default,
the table is rendered without a surrounding border. The table is
generally sized automatically to fit the contents, but you can also set
the table width using the WIDTH attribute.
BORDER, CELLSPACING and
CELLPADDING provide further control over the table's
appearence. Captions are rendered at the top or bottom of the table
depending on the ALIGN attribute.
Each table row is contained in a TR element, although
the end tag can always be omitted. Table cells are defined by
TD elements for data and TH elements for
headers. Like TR, these are containers and can be given
without trailing end tags. TH and TD support
several attributes: ALIGN and VALIGN for
aligning cell content, ROWSPAN and COLSPAN for
cells which span more than one row or column. A cell can contain a wide
variety of other block and text level elements including form fields and
other tables.
The TABLE element always requires both start and end tags.
It supports the following attributes:
- align
- This takes one of the case insensitive values: LEFT,
CENTER or RIGHT. It specifies the horizontal
placement of the table relative to the current left and right margins.
It defaults to left alignment, but this can be overridden by an
enclosing DIV or
CENTER element.
- width
- In the absence of this attribute the table width is automatically
determined from the table contents. You can use the WIDTH
attribute to set the table width to a fixed value in pixels (e.g.
WIDTH=212) or as a percentage of the space between the
current left and right margins (e.g. WIDTH="80%").
- border
- This attribute can be used to specify the width of the outer border
around the table to a given number of pixels (e.g.
BORDER=4). The value can be set to zero to suppress the
border altogether. In the absence of this attribute the border should be
suppressed. Note that some browsers also accept <TABLE
BORDER> with the same semantics as BORDER=1.
- cellspacing
- In traditional desktop publishing software, adjacent table cells
share a common border. This is not the case in HTML. Each cell is given
its own border which is separated from the borders around neighboring
cells. This separation can be set in pixels using the
CELLSPACING attribute, (e.g. CELLSPACING=10).
The same value also determines the separation between the table border
and the borders of the outermost cells.
- cellpadding
- This sets the padding in pixels between the border around each cell
and the cell's contents.
The CAPTION element has one attribute ALIGN
which can be either ALIGN=TOP or ALIGN=BOTTOM.
This can be used to force the caption to be placed above the top or
below the bottom of the table respectively. Most user agents default to
placing the caption above the table. CAPTION always
requires both start and end tags. Captions are limited to plain text and
text-level elements as defined by the %text entity. Block-level elements
are not permitted.
The TR or table row element requires a start tag, but
the end tag can always be left out. TR acts as a container
for table cells. It has two attributes:
- align
- Sets the default horizontal alignment of cell contents. It takes
one of the case insensitive values: LEFT, CENTER
or RIGHT and plays the same role as the ALIGN
attribute on paragraph elements.
- valign
- This can be used to set the default vertical alignment of cell
contents within each cell. It takes one of the case insensitive values:
TOP, MIDDLE or BOTTOM to position
the cell contents at the top, middle or bottom of the cell respectively.
There are two elements for defining table cells. TH is
used for header cells and TD for data cells. This
distinction allows user agents to render header and data cells in
different fonts and enables speech-based browsers to do a better job.
The start tags for TH and TD are always needed
but the end tags can be left out. Table cells can have the following
attributes:
- nowrap
- The presence of this attribute disables automatic word wrap
within the contents of this cell (e.g. <TD NOWRAP>).
This is equivalent to using the entity for
non-breaking spaces within the content of the cell.
- rowspan
- This takes a positive integer value specifying the number of
rows spanned by this cell. It defaults to one.
- colspan
- This takes a positive integer value specifying the number of
columns spanned by this cell. It defaults to one.
- align
- Specifies the default horizontal alignment of cell
contents, and overrides the ALIGN attribute on the table
row. It takes the same values: LEFT, CENTER
and RIGHT. If you don't specify an ALIGN
attribute value on the cell, the default is left alignment for
<td> and center alignment for <th>
although you can override this with an ALIGN attribute on
the TR element.
- valign
- Specifies the default vertical alignment of cell
contents, overriding the VALIGN attribute on the table row.
It takes the same values: TOP, MIDDLE and
BOTTOM. If you don't specify a VALIGN attribute value on
the cell, the default is middle although you can override this with a
VALIGN attribute on the TR element.
- width
- Specifies the suggested width for a cell content in pixels
excluding the cell padding. This value will normally be
used except when it conflicts with the width requirements
for other cells in the same column.
- height
- Specifies the suggested height for a cell content in pixels
excluding the cell padding. This value will normally be
used except when it conflicts with the height requirements
for other cells in the same row.
Tables are commonly rendered in bas-relief, raised up with the outer
border as a bevel and individual cells inset into this raised surface.
Borders around individual cells are only drawn if the cell has explicit
content. White space doesn't count for this purpose except .
The algorithms used to automatically size tables should take
into account the minimum and maximum width requirements for each
cell. This is used to determine the minimum and maximum width
requirements for each column and hence for the table itself.
Cells spanning more than one column contribute to the
widths of each of the columns spanned. One approach is to evenly
apportion the cell's minimum and maximum width between these
columns, another is to weight the apportioning according to the
contributions from cells that don't span multiple columns.
For some user agents it may be necessary or desirable to break
text lines within words. In such cases, a visual indication that this
has occurred is advised.
The minimum and maximum width of nested tables contribute to the
minimum and maximum width of the cell in which they occur. Once the
width requirements are known for the top-level table, the column widths
for that table can be assigned. This allows the widths of nested tables
to be assigned and hence, in turn, the column widths of such tables.
If practical, all columns should be assigned at least their minimum
widths. It is suggested that any surplus space is then shared out
proportional to the difference between the minimum and maximum width
requirements of each column.
Note that pixel values for width and height refer to screen pixels, and
should be multiplied by an appropriate factor when rendering to very high
resolution devices such as laser printers. For instance, if a user agent has
a display with 75 pixels per inch and is rendering to a laser printer with
600 dots per inch, then the pixel values given in HTML attributes should be
multiplied by a factor of 8.
|