8.3. Alphabetical Tag Reference
<a> |
NN all IE all HTML all
|
<a>...</a>
|
HTML End Tag: Required
|
The a element is the rare element that can be an
anchor and/or a link, depending on the presence of the
name and/or href attributes. As
an anchor, the element defines a named location in a document to
which any URL can reference by appending a hashmark and the anchor
name to the document's URI (for example,
http://www.megacorp.com/contents#a-c). Names are
identifiers assigned to the name attribute (or in
newer browsers, the id attribute). Content defined
solely as an anchor is not (by default) visually differentiated from
surrounding body content.
By assigning a URI to the href attribute, the
element becomes the source of a hypertext link. Activating the link
generally navigates to the URI assigned to the
href attribute (or it may load other media into a
helper application or plugin without changing the page). Unless
modified by style sheets, links typically have a distinctive
appearance in the browser, such as an underline beneath text (or
border around an object) and a color other than the current content
color. Attributes can define separate colors for three states: an
unvisited link, a link being activated by the user, and a previously
visited link (the linked document is currently in the browser cache).
Such color control is deprecated in favor of CSS pseudo-classes
(:link, :active,
:visited, and a new state,
:hover). An a element can be
both an anchor and a link if, in the least, both the
name (or id) and
href attributes have values assigned to them.
Example
<a name="anchor3" id="anchor3">Just an anchor named "anchor3."</a>
<a href="#anchor3">A link to navigate to "anchor3" in the same document.</a>
<a name="anchor3" id="anchor3" href="http://www.megacorp.com/index.html">
Go from here (anchor 3) to home page.</a>
Object Model Reference
[window.]document.links[i]
[window.]document.anchors[i]
[window.]document.getElementById(elementID)
Element-Specific Attributes
charset
|
coords
|
datafld
|
datasrc
|
href
|
hreflang
|
methods
|
name
|
rel
|
rev
|
shape
|
target
|
type
|
urn
|
|
Element-Specific Event Handler Attributes
None. Anchor-only a elements have no event handlers in Navigator through Version 4.
charset | NN 6 IE n/a HTML 4 |
charset="characterSet" | Optional | Character encoding of the content at the other end of the link.
Example
<a charset="csISO5427Cyrillic" href="moscow.html">Visit Moscow</a>
Value
Case-insensitive alias from the character set registry (ftp://ftp.isi.edu/in-notes/iana/assignments/character-sets).
Default
Determined by browser.
coords="coord1, ... coordN" | Optional | Although defined for the a element, the
coords attribute applies to the
area element for client-side image maps. The
area element
"inherits" many attributes and
behaviors of the a element. See the
area element.
datafld | NN n/a IE 4 HTML n/a |
datafld="columnName" | Optional | Used with IE data binding to associate a remote data source column
name in lieu of an href attribute for a link. The
data source column must contain a valid URI (relative or absolute). A
datasrc attribute must also be set for the
element. Works only with text file data sources in IE 5/Mac.
Example
<a datasrc="DBSRC3" datafld="newsURL">Late-Breaking News</a>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.links[i].dataFld
[window.]document.getElementById(elementID).dataFld
datasrc | NN n/a IE 4 HTML n/a |
datasrc="dataSourceName" | Optional | Used with IE data binding to specify the ID of the
page's object element that loads
the data source object for remote data access. Content from the data
source to be inserted into the a element text is
specified via the datafld attribute. Works only
with text file data sources in IE 5/Mac.
Example
<a datasrc="DBSRC3" datafld="newsURL">Late-Breaking News</a>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.links[i].dataSrc
[window.]document.getElementById(elementID).dataSrc
href | NN all IE all HTML all |
href="URI" | Required for links | The URI of the destination of a link. In browsers, when the URI is an
HTML document, the document is loaded into the current (default) or
other window target (as defined by the target
attribute). For some other file types, the browser may load the
destination content into a plugin or save the destination file on the
client machine. In the absence of the href
attribute, the element does not distinguish itself in a browser as a
clickable link and may instead be only an anchor (if the
name or id attribute is set).
Example
<a href="part1/chap3.html">Chapter 3</a>
Value
Any valid URI, including complete and relative URLs, anchors on the
same page (anchor names prefaced with the #
symbol), and the javascript: pseudo-URL in
scriptable browsers to trigger a script statement rather than
navigate to a destination.
Default
None.
Object Model Reference
[window.]document.links[i].href
[window.]document.getElementById(elementID).href
In both browsers, other link object properties allow for the
extraction of components of the URL, such as protocol and hostname.
See the a element in Chapter 9.
hreflang="languageCode" | Optional | The language code of the content at the destination of a link.
Requires that the href attribute also be set. This
attribute is primarily an advisory attribute to help a browser
prepare itself for a new language set if the browser is so enabled.
Example
<a hreflang="HI" href="hindi/Chap3.html>Chapter 3 (in Hindi)</a>
Value
Case-insensitive language code.
Default
Browser default.
methods | NN n/a IE 4 HTML n/a |
methods="http-method" | Optional | An advisory attribute about the functionality of the destination of a
link. A browser could use this information to display special colors
or images for the element content based on what the destination will
do for the user.
Example
<a href="http://www.megacorp.com/cgi-bin/search?chap3" methods="get">
Chapter 3</a>
Value
Comma-delimited list of one or more HTTP methods.
Default
None.
Object Model Reference
[window.]document.links[i].Methods
[window.]document.getElementById(elementID).Methods
name | NN all IE all HTML all |
name="elementIdentifier" | Required for anchors | The traditional way to signify an anchor position within a document.
Other link elements can refer to the anchor by setting their
href attributes to a URL ending in a pound sign
(#) followed by the identifier. Omitting the
name (and id) attribute for the
a element prevents the element from being used as
an anchor position. This attribute is interchangeable with the
id attribute in recent browsers. The attribute is
deprecated in XHTML 1.0, so you are encouraged to use both attributes
(with the same identifier) to keep all browser generations happy. If
the name and href attribute are
set in the element, the element is considered both an anchor and a
link.
Example
<a id="sect3" name="sect3">Section III</a>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.links[i].name
[window.]document.anchors[i].name
[window.]document.getElementById(elementID).name
Defines the relationship between the current element and the
destination of the link. Also known as a forward
link, not to be confused in any way with the destination
document whose address is defined by the href
attribute. The HTML 4 recommendation defines several link types; it
is up to the browser to determine how to employ the value. This
attribute has meaning primarily for the link
element, although there is significant room for future application
for tasks such as assigning an a element (acting
as a link) to a button in a static navigation bar pointing to the
next or previous document in a series. The element must include an
href attribute for the rel
attribute to be applied.
Example
<a rel="next chapter" href="chapter3.html">Chapter 3</a>
Value
Case-insensitive, space-delimited list of HTML 4 standard link types
applicable to the element. Sanctioned link types are:
alternate
|
appendix
|
bookmark
|
chapter
|
contents
|
copyright
|
glossary
|
help
|
index
|
next
|
prev
|
section
|
start
|
stylesheet
|
subsection
|
|
In addition, IE 3 defined a fixed set of four values:
same | next |
parent | previous, but only
next and previous continue to
be supported in IE.
Default
None.
Object Model Reference
[window.]document.links[i].rel
[window.]document.getElementById(elementID).rel
A reverse link relationship. Like the rel
attribute, the rev attribute's
capabilities are defined by the browser, particularly with regard to
how the browser interprets and renders the various link types
available in the HTML 4 specification. Given two documents (A and B)
containing links that point to each other, the rev
value of B is designed to express the same relationship between the
two documents as denoted by the rel attribute in
A. There is not yet much application of either the
rel or rev attributes of the
a element in mainstream browsers.
Example
<a rev="previous" href="chapter2.html">Chapter 2</a>
Value
Case-insensitive, space-delimited list of standard link types
applicable to the element. See the rel attribute
for sanctioned and supported link types.
Default
None.
Object Model Reference
[window.]document.links[i].rev
[window.]document.getElementById(elementID).rev
shape | NN n/a IE n/a HTML 4 |
Defines the shape of a server-side image map area whose coordinates
are specified with the coords attribute. See the
area element.
target | NN all IE all HTML all |
target="windowOrFrameName" | Optional | If the destination document is to be loaded into a window or frame
other than the current window or frame, you can specify where the
destination document should load by assigning a window or frame name
to the target attribute. Target frame names must
be assigned to frames and windows as identifiers. Assign names to
frames via the name and id
attributes of the frame element; assign names to
new windows via the second parameter of the window.open(
) scripting method. If you omit this attribute, the
destination document replaces the document containing the link. An
identifier other than one belonging to an existing frame or window
opens a new window for the destination document. This attribute is
applicable only when a value is assigned to the
href attribute of the element.
A link element can have only one destination document and one target.
If you want a link to change the content of multiple frames, you can
use an a element's
onclick event handler or a
javascript: pseudo-URL to fire a script that loads
multiple documents. Set the location.href property
of each frame to a desired URL.
Strict DTDs for HTML 4 and XHTML do not support the
target attribute of any element because frames and
windows are outside the scope of pure document markup. In fact,
framesetting documents will not validate in the strict
environment—thus the purpose of the separate frameset DTDs for
HTML 4 and XHTML. If your documents must validate with these strict
DTDs, and you wish to support targets, use scripts to set
target properties of links, image maps, and forms
after the page has loaded.
Example
<a target="display" href="chap3.html#sec2">Section 3.2</a>
<a target="_top" href="index.html">Start Over</a>
Value
Case-sensitive identifier when the frame or window name has been
assigned via the target element's
name and id attributes. Four
reserved target names act as constants:
- _blank
-
Browser creates a new window for the destination document.
- _parent
-
Destination document replaces the current frame's
framesetting document (if one exists; otherwise, it is treated as
_self).
- _self
-
Destination document replaces the current document in its window or
frame.
- _top
-
Destination document is to occupy the entire browser window,
replacing any and all framesets that may be loaded (also treated as
_self if there are no framesets defined in the
window).
Default
_self
Object Model Reference
[window.]document.links[i].target
[window.]document.getElementById(elementID).target
An advisory about the content type of the destination document or
resource. A browser might use this information to assist in preparing
support for a resource requiring a multimedia player or plugin.
Example
<a type="video/mpeg" href="ski4.mpeg">View Devil's Ghost slope</a>
Value
Case-insensitive MIME type. A catalog of registered MIME types is
available from ftp://ftp.isi.edu/in-notes/iana/assignments/media-types/.
Default
None.
A Uniform Resource Name version of the destination document specified
in the href attribute. This attribute is intended
to offer support in the future for the URN format of URI, an evolving
recommendation under discussion at the IETF (see RFC 2141). Although
supported in IE 4 and later, this attribute does not take the place
of the href attribute.
Example
<a urn="urn:foo:bar3" href="chapter3.html">Chapter 3</a>
Value
A valid URN in the form of
"urn:NamespaceID:NamespaceSpecificString".
Default
None.
Object Model Reference
[window.]document.links[i].urn
[window.]document.getElementById(elementID).urn
<abbr>...</abbr> | HTML End Tag: Required | The abbr element provides an encapsulation and
enumeration mechanism for abbreviations that appear in the body text.
For example, consider a web page that includes your
company's address. At one point in the document, the
abbreviation IA is used for Iowa. A spelling checker, language
translation program, or speech synthesizer might choke on this
abbreviation; a search engine would not include the word
"Iowa" in its relevancy rating
calculation. But by turning the IA text into an
abbr element (and assigning a
title attribute to it), you can provide a
full-text equivalent that a search engine (if so equipped) can count;
a text-to-speech program would read aloud the full state name instead
of some guttural gibberish. Like many elements introduced in HTML
4.0, this one is intended to assist browser technologies that may not
yet be implemented but could find their way into products of the
future.
Netscape 6 renders the abbr element with a dotted
underline, and turns the cursor into a help icon. The context menu
for such an element contains a Properties choice, which leads to a displayed
list of attributes and their values for the visitor.
A related element, acronym, offers the same
services for words that are acronyms (although Netscape 6 offers no
special rendering). Both elements are part of a larger group of what
the HTML 4.0 recommendation calls phrase
elements.
Example
Ottumwa, <abbr title="Iowa">IA</abbr> 55334<br>
<abbr lang="de" title="und so weiter">usw.</abbr>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<acronym> | NN 6 IE 4 HTML 4 |
<acronym>...</acronym> | HTML End Tag: Required | The acronym element provides an encapsulation and
enumeration mechanism for acronyms that appear in the body text. For
example, consider a web page that includes a discussion of
international trade issues. At one point in the document, the acronym
GATT is used for General Agreement on Tariffs and Trade. A spelling
checker, language translation program, or speech synthesizer might
choke on this acronym; a search engine would not include the word
"tariffs" in its relevancy rating
calculation. But by turning the GATT text into an
acronym element (and assigning a
title attribute to it), you can provide a
full-text equivalent that a search engine (if so equipped) can count;
a text-to-speech program would read aloud the full meaning of the
acronym. Like many elements introduced in HTML 4.0, this one is
intended to assist browser technologies that may not yet be
implemented but could find their way into products of the future.
A related element, abbr, offers the same services
for words that are abbreviations. Both elements are part of a larger
group of what the HTML 4 recommendation calls phrase
elements.
Example
<acronym title="General Agreement on Tariffs and Trade">GATT</acronym>
<acronym lang="it" title="Stati Uniti">s.u.</acronym>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<address> | NN all IE all HTML all |
<address>...</address> | HTML End Tag: Required | Prior to HTML 4, the address element was often
regarded as a display formatting tag appropriate for displaying a
page author's contact information on the page.
Navigator and Internet Explorer display address
elements in an italic font. But the increased focus on separating
content from form in HTML 4 adds some extra meaning to this element.
Search engines and future HTML (or XML) parsers may apply special
significance to the content of this element, perhaps in cataloging
author information separate from the hidden information located in
meta elements. If you want to use this structural
meaning of the element while keeping the rendering in line with the
rest of your body text, you need to assign style sheet rules to
override the browser's default formatting tendencies
for this element. Any standard body elements, such
as links, can be contained inside an address
element.
Example
<address>
<p>Send comments to:<a href="mailto:jb@megacorp.com">jb@megacorp.com</a>
</p>
</address>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<applet> | NN 2 IE 3 HTML 3.2 |
<applet>...</applet> | HTML End Tag: Required | You can embed an executable chunk of Java code in an HTML document in
the form of an applet. An applet occupies a rectangular area of the
page, even if it is only one-pixel square. An applet may require that
some initial values be set from the HTML document. One or more
param elements can be used to pass parameters to
the applet before the applet starts running (provided the applet is
written to accept these parameters). param
elements go between the start and end tags of an
applet element.
Applets are compiled by their authors into class files (filename
suffix .class). An applet class file must be in
the same directory as, or a subdirectory of, the HTML document that
loads the applet. Key attributes of the applet
element direct the browser to load a particular class file from the
necessary subdirectory.
All user interface design for the applet is programmed into the
applet in the Java language. One of the roles of attributes in the
applet element is to define the size and other
geographical properties of the applet for its rendering on the page.
Recent browsers allow JavaScript scripts to communicate with the
applet, as well as allowing applets to access document elements (not
implemented in Netscape 6).
Note that HTML 4 deprecates the applet element in
favor of the more generic object element. Support
for embedding applets via the object element is
still spotty. Browser support for the applet
element will continue for some time to come, however.
Example
<applet code="simpleClock.class" name="myClock" width="400" height="50">
<param name="bgColor" value="black">
<param name="fgColor" value="yellow">
</applet>
Object Model Reference
[window.]document.applets[i]
[window.]document.appletName
[window.]document.getElementById(elementID)
Element-Specific Attributes
align
|
alt
|
archive
|
code
|
codebase
|
datafld
|
datasrc
|
height
|
hspace
|
mayscript
|
name
|
object
|
src
|
vspace
|
width
|
Element-Specific Event Handler Attributes
Handler
|
NN
|
IE
|
HTML
|
onafterupdate
|
n/a
|
4
|
n/a
|
onbeforeupdate
|
n/a
|
4
|
n/a
|
ondataavailable
|
n/a
|
4
|
n/a
|
ondatasetchanged
|
n/a
|
4
|
n/a
|
ondatasetcomplete
|
n/a
|
4
|
n/a
|
onerrorupdate
|
n/a
|
4
|
n/a
|
onrowenter
|
n/a
|
4
|
n/a
|
onrowexit
|
n/a
|
4
|
n/a
|
align="alignmentConstant" | Optional | The align attribute determines how the rectangle
of the applet aligns within the context of surrounding content. See
the Section 8.1.5,
earlier in this chapter for description of the possibilities defined
in both Navigator and Internet Explorer for this attribute.
Example
<applet code="simpleClock.class" name="myClock" align="absmiddle"
width="400" height="50"></applet>
Value
Case-insensitive constant value.
Default
bottom
Object Model Reference
[window.]document.applets[i].align
[window.]document.appletName.align
[window.]document.getElementById(elementID).align
alt="textMessage" | Optional | If a browser does not have the facilities to load and run Java
applets or if the browser has Java support turned off in its
preferences, the text assigned to the alt
attribute is supposed to display in the document where the
applet element's tag appears.
Typically, this text provides advice on what the page visitor is
missing by not being able to load the Java applet. Unlike the
noscript or noframes elements,
there is no corresponding element for an absent Java applet
capability. In practice, browsers don't necessarily
display this message for applets that fail to load for a variety of
reasons.
Example
<applet code="simpleClock.class" name="myClock" align="absmiddle"
alt="A Java clock applet." width="400" height="50"></applet>
Value
Any quoted string of characters.
Default
None.
archive="archiveFileURL" | Optional | The precise meaning of the archive attribute
varies between the generic HTML 4 recommendation and
Netscape's specific implementation. The basic idea
behind Netscape's archive
attribute is that an author can package multiple class files into a
single uncompressed .zip archive file and let
the browser load the entire set of classes at one time. This can
offer a performance improvement over loading just the main class file
(specified by the code attribute) and then letting
the class loader fetch each additional class file as needed.
In addition to specifying the archive attribute,
be sure to include a code attribute that names the
main class to load. Navigator first looks for the presence of that
class file in the archive. If the file is missing from the archive,
Navigator loads the code class file separately.
(That class may then load additional supporting class files
individually.) Navigator requires that the archive file have a
.zip filename extension. The URL must also be
relative to the codebase location.
The HTML specification allows multiple URLs to be specified (in a
space-delimited list) for additional class or other resource files.
This design anticipates the use of the same attribute with the
object element, which the W3C has deemed the
successor to the applet element. IE 6 supports the
existence of the attribute for compatibility only, but it is not
operable.
Example
<applet code="ScriptableClock.class" archive="myClock.zip" width="400" height="50">
</applet>
Value
Case-sensitive URI.
Default
None.
Object Model Reference
[window.]document.applets[i].archive
[window.]document.appletName.archive
[window.]document.getElementById(elementID).archive
code="fileName.class" | Required | The name of the main class file that starts and runs the applet. If
the codebase attribute is not specified, the
code attribute must include a path from the
directory that stores the HTML document loading the applet. You might
get away with omitting the .class filename
extension, but don't take any chances: be complete
with the class name. Most servers are case-sensitive, so also match
case of the actual class filename.
Example
<applet code="applets/ScriptableClock.class" width="400" height="50">
</applet>
Value
Case-sensitive .class filename or complete path
relative to the HTML document.
Default
None.
Object Model Reference
[window.]document.applets[i].code
[window.]document.appletName.code
[window.]document.getElementById(elementID).code
codebase | NN 2 IE 3 HTML 3.2 |
Path to the directory holding the class file designated in either the
code or archive attribute. The
codebase attribute does not name the class file,
just the path. You can make this attribute a complete URL to the
directory, but don't try to access a codebase
outside of the domain of the current document: security restrictions
may prevent the class from loading. A full path and filename can be
set together in the code or
object attribute, eliminating the need for the
codebase attribute setting.
Example
<applet code="ScriptableClock.class" codebase="applets/" width="400" height="50">
</applet>
Value
Case-sensitive pathname, usually relative to the directory storing
the current HTML document.
Default
None.
Object Model Reference
[window.]document.applets[i].codeBase
[window.]document.appletName.codeBase
[window.]document.getElementById(elementID).codeBase
See the param element for IE data binding to Java
applets.
height, width | NN 2 IE 3 HTML 3.2 |
width="pixels"
height="pixels" The size that a Java applet occupies in a document is governed by the
height and width attribute
settings. Some browser versions might allow you to get away without
assigning these attributes, letting the applet's own
user interface design determine the height and width of its visible
rectangle. As with images, however, it is more efficient for the
browser's rendering engine when you explicitly
specify the object's dimensions. Make a habit of
supplying these values for all applets, as you should for all images
or other visible external objects.
Example
<applet code="ScriptableClock.class" width="400" height="50"></applet>
Value
Positive integer pixel values. You cannot entirely hide an applet by
setting values to zero, but you can reduce its height and width to
one pixel in each dimension. If you want to hide an applet, do so
with DHTML by setting its positioning display
attribute to none.
Default
None.
Object Model Reference
[window.]document.applets[i].height
[window.]document.appletName.height
[window.]document.getElementById(elementID).height
[window.]document.applets[i].width
[window.]document.appletName.width
[window.]document.getElementById(elementID).width
hspace, vspace | NN 2 IE 3 HTML 3.2 |
hspace="pixels"
vspace="pixels" You can put some empty space
("air") between an applet and any
surrounding content by assigning pixel values to the
hspace and vspace attributes.
The vspace attribute governs space above and below
the applet; the hspace attribute governs space to
the left and right of the applet. For browsers that are style sheet
savvy, you are perhaps better served by using the padding and/or
margin style attributes to gain control down to individual sides, if
you so desire.
Example
<applet code="ScriptableClock.class" width="400" height="50" hspace="3" vspace="4">
</applet>
Value
Positive integer pixel values (optionally quoted).
Default
0
Object Model Reference
[window.]document.applets[i].hspace
[window.]document.appletName.hspace
[window.]document.getElementById(elementID).hspace
[window.]document.applets[i].vspace
[window.]document.appletName.vspace
[window.]document.getElementById(elementID).vspace
id="elementIdentifier" | Optional | A unique identifier that distinguishes this element from all the rest
in the document. Can be used to associate a single element with a
style rule naming this attribute value as an ID selector. An element
can have an ID assigned for uniqueness as well as a class for
inclusion within a group. See Chapter 3.
If you assign an id attribute and not a
name attribute, the value of the
id attribute can be used as the
applet's name in script reference forms that use the
element name (document.appletName).
Example
<applet id="clocker" code="ScriptableClock.class" width="400" height="50">
</applet>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.applets[i].id
[window.]document.appletName.id
[window.]document.getElementById(elementID).id
mayscript | NN 3 IE 4 HTML n/a |
Navigator 3 introduced a technology called LiveConnect, which allowed
scripts to communicate with Java applets and vice versa (not yet
implemented in Mozilla-based browsers). For security reasons, an
applet's communications facilities with scripts must
be explicitly switched on by the page author. By adding the
mayscript attribute to the
applet's tag, an applet that is written to take
advantage of the document objects and scripts can address those
items. In other words, the HTML is granting the applet the ability to
reach scripts in the document. This attribute is a simple switch:
when the attribute name is present, it is turned on.
One more step is required for an applet to communicate with
JavaScript. The applet code must import a special Netscape class
called JSObject.class. This class file and its
companion exception class are built into the Java support in the
Windows version of Internet Explorer 4 and later. Although the
execution is not perfect in IE, applets can perform basic
communication with scripts.
Example
<applet code="ScriptableClock.class" width="400" height="50" mayscript>
</applet>
Value
No value assigned to the attribute. The presence of the attribute
name sets turns on applet-to-script communication.
Default
Off.
name="elementIdentifier" | Optional | If you are scripting an applet, it is usually more convenient to
create a reference to the applet by using a unique name you assign to
the applet. Then, if you edit the page and move or delete multiple
applets on the page, you do not have to worry about adjusting index
values to array-style references. In IE 4 and later, you have the
option of omitting the name attribute and using
the id attribute value in script references to the
applet object.
Example
<applet name="clock2" code="ScriptableClock.class" width="400" height="50">
</applet>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.applets[i].name
[window.]document.appletName.name
[window.]document.getElementById(elementID).name
object="filename" | Optional | Reference to the name of the file (relative to the codebase URI) that
preserves the applet's state between sessions. When
supported properly, this attribute replaces the
code attribute, and the data file points to the
applet's startup class file.
Example
<applet name="clock2" object="clockData.dat" width="400" height="50">
</applet>
Value
Case-sensitive filename.
Default
None.
Object Model Reference
[window.]document.applets[i].object
[window.]document.appletName.object
[window.]document.getElementById(elementID).object
Internet Explorer defines this attribute as the URL for an
"associated file." This may be the
same as the archive attribute defined in HTML and
Navigator specifications. The src attribute is not
a substitute for the code and/or
codebase attributes.
Value
A complete or relative URL.
Default
None.
Object Model Reference
[window.]document.applets[i].src
[window.]document.appletName.src
[window.]document.getElementById(elementID).aex
See hspace.
See height.
<area> | NN all IE all HTML 3.2 |
<area> | HTML End Tag: Forbidden | A map element defines a client-side image map that
is ultimately associated with an image or other object that occupies
space on the page. The only job of the map element
is to assign a name and a tag context for one or more
area element definitions. Each
area element defines how the page should respond
to user interaction with a specific geographical region of the image
or other object.
A client-side image map area can act like an a
element link in that an area can link to a destination or
javascript: pseudo-URL and assign another frame or
window as the target for loading a new document. In fact, in the
original scripting document object model, an area
element is referenced as a link. It is not uncommon to use
client-side area maps in a navigation bar occupying a slender frame
of a frameset. This allows an artist to be creative with a menu
design, while giving the page author the power to turn any segment of
a larger image into a special-purpose link.
Example
<map name="nav">
<area coords="20,30,120,70" href="contents.html" target="display">
<area coords="20,80,145,190" href="contact.html" target="display">
</map>
Object Model Reference
[window.]document.links[i]
[window.]document.getElementById(elementID)
Element-Specific Attributes
alt
|
coords
|
href
|
nohref
|
shape
|
target
|
|
|
|
|
Element-Specific Event Handler Attributes
None.
alt="textMessage" | Required | Nongraphical browsers can use the alt attribute
setting to display a brief description of the meaning of the
(invisible) image's hotspots. At one time, it was
thought that the alt message might be displayed in
the browser's status bar by default when the area
had focus or the cursor rolled over the area. That function is now
typically performed by onmouseover event handlers
and scripts. Keep in mind that recent handheld computers usually have
nongraphical browsers (or allow graphics to be turned off for
improved performance). Don't ignore the graphically
impaired.
Example
<area coords="20,30,120,70" href="contents.html" target="display"
alt="Table of Contents">
Value
Any quoted string of characters.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).alt
coords | NN all IE all HTML 3.2 |
coords="coord1, ... coordN" | Optional | Although the formal W3C definition for the coords
attribute of an area element states that the
attribute is optional, that doesn't mean that you
can omit this attribute and expect an area to
behave as it should. The coords attribute lets you
define the outline of the area to be associated with a particular
link or scripted action. Some third-party authoring tools can assist
in determining the coordinate points for a hot area. You can also
load the image into a graphics program that displays the cursor
position in real time and then transfer those values to the
coords attribute values.
Coordinate values are entered as a comma-delimited list. If two areas
overlap, the area that is defined earlier in the HTML code takes
precedence.
Example
<area coords="20,30,120,70" href="contents.html" target="display">
Value
Each coordinate is a length value, but the number of coordinates and
their order depend on the shape specified by the
shape attribute, which may optionally be
associated with the element. For shape="rect",
there are four coordinates (left, top, right, bottom); for
shape="circle", there are three coordinates
(center-x, center-y, radius); for shape="poly",
there are two coordinate values for each point that defines the shape
of the polygon (x1, y1,
x2, y2, x3,
y3,...xN,
yN).
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).coords
href | NN all IE all HTML 3.2 |
The URI of the destination of a link associated with the area. In a
browser, when the URI is an HTML document, the document is loaded
into the current (default) or other window target (as defined by the
target attribute). For some other file types, the
browser may load the destination content into a plugin or save the
destination file on the client machine. Because IE 3 and Navigator
(up to Version 4) treat area elements as
a elements, the href attribute
must be defined in the area element for scripts in
the old DOM to access various properties about the URL and for event
handlers (such as onmouseover) to work.
Example
<area coords="20,30,120,70" href="contents.html" target="display">
Value
Any valid URI, including complete and relative URLs, anchors on the
same page (anchor names prefaced with the #
symbol), and the javascript: pseudo-URL in
scriptable browsers to trigger a script statement rather than
navigate to a destination.
Default
None.
Object Model Reference
[window.]document.links[i].href
[window.]document.getElementById(elementID).href
Other link object properties allow for the extraction of components
of the URL, such as protocol and hostname. See the
Link object in Chapter 9.
nohref | NN all IE all HTML 3.2 |
Tells the browser that the area defined by the coordinates has no
link associated with it (as not including any href
attribute does). When you include this attribute, scriptable browsers
no longer treat the element as a link. When an
area element lacks an href
attribute, the element no longer responds to user events. In IE 4 and
later and Netscape 6, you can turn this attribute on and off from a
script by setting the corresponding noHref
property to true or false.
Example
<area coords="20,30,120,70" nohref>
Value
The presence of this attribute sets its value to
true. Extend for XHTML compliance by using
nohref="nohref".
Default
Off.
Object Model Reference
[window.]document.getElementById(elementID).noHref
shape | NN all IE all HTML 3.2 |
shape="shapeName" | Optional | Defines the shape of the client-side area map whose coordinates are
specified with the coords attribute. The
shape attribute tells the browser how many
coordinates to expect.
Example
<area shape="poly" coords="20,20,20,70,65,45" href="contents.html"
target="display">
Value
Case-insensitive shape constant. Each implementation defines its own
set of shape names and equivalents, but there are common denominators
across browsers (circle, rect,
poly, and polygon).
Shape name
|
NN
|
IE
|
HTML
|
circ
|
-
|
•
|
•
|
circle
|
•
|
•
|
•
|
poly
|
•
|
•
|
•
|
polygon
|
•
|
•
|
-
|
rect
|
•
|
•
|
•
|
rectangle
|
-
|
•
|
-
|
Default
rect
Object Model Reference
[window.]document.getElementById(elementID).shape
target | NN all IE all HTML 3.2 |
target="windowOrFrameName" | Optional | If the destination document is to be loaded into a window or frame
other than the current window or frame, you can specify where the
destination document should load by assigning a window or frame name
to the target attribute. Target frame names must
be assigned to frames and windows as identifiers. Assign names to
frames via the name and id
attributes of the frame element; assign names to
new windows via the second parameter of the window.open(
) scripting method. If you omit this attribute, the
destination document replaces the document containing the link. This
attribute is applicable only when a value is assigned to the
href attribute of the element.
An area element can have only one destination
document and one target. If you want a link to change the content of
multiple frames, you can use an area
element's onclick event handler
(check Chapter 9 for supported browser
versions) or a javascript: pseudo-URL to fire a
script that loads multiple documents. Set the
location.href property of each frame to the
desired URL.
Strict DTDs for HTML 4 and XHTML do not support the
target attribute of any element because frames and
windows are outside the scope of pure document markup. In fact,
framesetting documents will not validate in the strict
environment—thus the purpose of the separate frameset DTDs for
HTML 4 and XHTML. If your documents must validate with these strict
DTDs, and you wish to support targets, use scripts to set
target properties of links, image maps, and forms
after the page has loaded.
Example
<area coords="20,30,120,70" href="contents.html" target="display">
<area coords="140,30,180,70" href="index.html" target="_top">
Value
Case-sensitive identifier when the frame or window name has been
assigned via the target element's
name and id attributes. Four
reserved target names act as constants:
- _blank
-
Browser creates a new window for the destination document.
- _parent
-
Destination document replaces the current frame's
framesetting document (if one exists; otherwise, it is treated as
_self).
- _self
-
Destination document replaces the current document in its window or
frame.
- _top
-
Destination document is to occupy the entire browser window,
replacing any and all framesets that may be loaded (also treated as
_self if there are no framesets defined in the
window).
Default
_self
Object Model Reference
[window.]document.links[i].target
[window.]document.getElementById(elementID).target
<b> | NN all IE all HTML all |
<b>...</b> | HTML End Tag: Required | The b element—one of several font style
elements in HTML 4—renders its content in a boldface version of
the font face governing the next outermost HTML container. You can
nest multiple font style elements to create combined styles, such as
bold italic (<b><i>bold-italic
text</i></b>).
It is up to the browser to fatten boldface display by calculating the
character weight or by perhaps loading a bold version of the
currently specified font. If you are striving for font perfection, it
is best to use style sheets (and perhaps downloadable fonts) to
specify a true bold font family, rather than risk the
browser's extrapolation of a boldface from a system
font. The font-weight CSS style attribute provides
quite granular control over the degree of bold applied to text if the
font face supports such fine-tuning.
You can take advantage of the containerness of this element by
assigning style sheet rules to some or all b
elements in a page. For example, you may wish all
b elements to be in a red color. By assigning the
style rule b {color:red}, you
can do it to all elements with only a tiny bit of code.
Although this element is not deprecated in HTML 4 or XHTML 1.0, it
would not be surprising to see it lose favor to style sheets in the
future.
Example
<p>This product is <b>new</b> and <b>improved</b>!</p>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<base> | NN all IE all HTML all |
<base> | HTML End Tag: Forbidden | A base element is defined inside a
document's head element to
instruct the browser about the URL path to the current document. This
path is used as the basis for all relative URLs used to specify
various src and href attributes
in the document. The base
element's URL should be a complete URL, including
the document name (though browsers tend to support URLs to
directories, too). The browser calculates the base URL path to the
directory holding the document. If you specify
<base
href="http://www.megacorp.com/products/index.html">,
the href attribute of a link on that page to
widgets/framitz801.html resolves to the full URL
of
http://www.megacorp.com/products/widgets/framitz801.html.
Similarly, a relative URL can walk up the hierarchy with the dot
syntax. For example, from the base element defined
earlier, an img element in the
index.html page might be set for
src="../images/logo.jpg". That reference resolves
to http://www.megacorp.com/images/logo.jpg.
By and large, today's browsers automatically
calculate the base URL of the currently loaded document, thus
allowing use of relative URLs without specifying a
base element. This is especially helpful when you
are developing pages locally and don't want to
change the base element settings when you deploy
the pages. The HTML 4 specification states that a document lacking a
base element should by default use the current
document's URL as the base URL.
Of course, this is only for true web pages, rather than HTML-enhanced
documents such as email messages, which have no default
base URL.
You can also use the base element to define a
default target for any link-type element in the document. Therefore,
if all links are supposed to load documents into another frame, you
can specify this target frame once in the base tag
and not worry about target attributes elsewhere in
the document. If you wish to override the default for a single link,
you may do so by specifying the target attribute
for that element (but see the note in the target
attribute).
The only attribute this element has in common with other elements is
the id attribute.
Example
<head>
<base href="http://www.megacorp.com/index.html" target="_top">
</head>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
Element-Specific Event Handler Attributes
None.
href | NN all IE all HTML all |
The href attribute is a URL of a document whose
server path is to be used as the base URL for all relative references
in the document. This is typically the URL of the current document,
but it can be set to another path if it makes sense to your document
organization and directory structure.
Example
<base href="http://www.megacorp.com/products/index.html">
Value
This should be a full and absolute URL to a document.
Default
Current document pathname.
Object Model Reference
[window.]document.getElementsByTagName("base")[0].href
[window.]document.getElementById(elementID).href
target | NN all IE all HTML 4 |
target="windowOrFrameName" | Optional | If all or most links and area maps on a page load documents into a
separate window or frame, you can set the target
attribute of the base element to take care of
targeting for all of those elements. You can set the
target attribute without setting the
href attribute if you want to set only the base
target reference.
Strict DTDs for HTML 4 and XHTML do not support the
target attribute of any element because frames and
windows are outside the scope of pure document markup. In fact,
framesetting documents will not validate in the strict
environment—thus the purpose of the separate frameset DTDs for
HTML 4 and XHTML. If your documents must validate with these strict
DTDs, and you wish to support targets, use scripts to set
target properties of links, image maps, and forms
after the page has loaded.
Example
<base target="rightFrame">
Value
Case-sensitive identifier when the frame or window name has been
assigned via the target element's
name attribute. Four reserved target names act as
constants:
- _blank
-
Browser creates a new window for the destination document.
- _parent
-
Destination document replaces the current frame's
framesetting document (if one exists; otherwise, it is treated as
_self).
- _self
-
Destination document replaces the current document in its window or
frame.
- _top
-
Destination document is to occupy the entire browser window,
replacing any and all framesets that may be loaded (also treated as
_self if there are no framesets defined in the
window).
Default
_self
Object Model Reference
[window.]document.getElementsByTagName("base")[0].target
[window.]document.getElementById(elementID).target
<basefont> | NN all IE all HTML 3.2 |
<basefont> | HTML End Tag: Forbidden | A basefont element advises the browser of some
font information to be used as the basis for text rendering of the
current page below the basefont element. You can
apply this element in either the head or
body portion of the document (although Microsoft
recommends in the body only for IE 4 and later),
and you can insert basefont elements as often as
is needed to set the base font for a portion of the document. Be
aware that basefont element settings do not
necessarily apply to content in tables. If you want table content to
resemble a custom basefont setting, you likely
have to set the font styles to table elements separately.
The basefont element overrides the default font
settings in the browser's user preferences settings.
Like most font-related elements, the basefont
element is deprecated in HTML 4 in favor of style sheets, and is
removed from the HTML 4 and XHTML strict DTDs.
Example
<basefont face="Times, serif" size="4">
Element-Specific Attributes
Element-Specific Event Handler Attributes
None.
color="colorTripletOrName" | Optional | Sets the font color of all text below the basefont
element. Deprecated in HTML 4 in favor of the
color CSS attribute.
Example
<basefont color="Olive">
Value
A hexadecimal triplet or plain-language color name. See Appendix A for acceptable plain-language color names.
Default
Browser default.
Object Model Reference
[window.]document.getElementsByTagName("basefont")[0].color
face="fontFaceName1[, ... fontFaceNameN]" | Optional | You can assign a hierarchy of font faces to use for the default font
of a section headed by a basefont element. The
browser looks for the first font face in the comma-delimited list of
font face names until it either finds a match in the client system or
runs out of choices, at which point the browser default font face is
used. Font face names must match the system font face names exactly.
If you use this attribute (instead of the preferred style sheet
attribute), you can always suggest a generic font face
(serif, sans-serif) as the
final choice. Deprecated in HTML 4 in favor of the
font-family CSS attribute.
In IE 3, this attribute was called the name
attribute.
Example
<basefont face="Bookman, Times Roman, serif">
Value
One or more font face names, including the recognized generic faces:
serif | sans-serif |
cursive | fantasy |
monospace.
Default
Browser default.
Object Model Reference
[window.]document.getElementsByTagName("basefont")[0].face
name | NN n/a IE |3| HTML n/a |
name="fontFaceName" | Optional | This was IE 3's version of what is today the
face attribute. It accepts a single font face as a
value. The name attribute is no longer used.
Value
A single font face name.
Default
Browser default.
size="integerOrRelativeSize" | Optional | Font sizes referenced by the size attribute are on
a relative size scale that is not tied to any one point size across
operating system platforms. The default browser font size is 3. The
range of acceptable values for the size attribute
are integers from 1 to 7 inclusive. The exact point size varies with
the operating system and browser design.
Users can often adjust the default font size in preferences settings.
The size attribute overrides that setting.
Moreover, size values can be relative to whatever
font size is set in the preferences. By preceding an attribute value
with a + or - sign, the
browser's default size can be adjusted upward or
downward, but always within the range of 1 through 7.
Example
<basefont size="4">
<basefont size="+3">
Value
Either an integer or relative value, consisting of a
+ or - symbol and an integer value.
Default
3
Object Model Reference
[window.]document.getElementsByTagName("basefont")[0].size
<bdo>...</bdo> | HTML End Tag: Required | The name of the bdo element stands for
bidirectional override. The
lang and dir attributes of most
elements are designed to take care of most situations involving the
mixture of writing systems that compose text in opposite directions.
The bdo element is designed to assist in instances
when the normal bidirectional algorithms must be explicitly
overridden, due to various conversions during text processing.
Because this element is not yet implemented in browsers, it is
detailed here for informational purposes only.
Example
<bdo dir="ltr">someMixedScriptTextHere</bdo>
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<bgsound> | NN n/a IE 3 HTML n/a |
<bgsound> | HTML End Tag: Optional | This Internet Explorer-only attribute lets you define a sound file
that is to play in the background while the user visits the page. The
element is allowed only inside the head element.
With scripting, you can control the volume and how many times the
sound track plays even after the sound file loads. Although an end
tag is optional, there is no need for it because all specifications
for the sound are maintained by attributes in the start tag. Only the
id attribute is shared with other elements.
If you are going to use this tag, I strongly recommend making the
background sound a user-selectable choice that is turned off by
default. In office environments, it can be startling (if not
embarrassing) to have background music or sounds unexpectedly emanate
from a computer. Also be aware that there is likely to be some delay
in the start of the music due to download time.
Example
<bgsound src="tunes/mazeppa.mid">
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
Element-Specific Event Handler Attributes
None.
balance | NN n/a IE 4 HTML n/a |
balance="signedInteger" | Optional | A value that directs how the audio is divided between the left and
right speakers. Once this attribute value is set in the element, its
value cannot be changed by script control.
Example
<bgsound src="tunes/mazeppa.mid" balance="+2500">
Value
A signed integer between -10,000 and +10,000. A value of
0 is equally balanced on both sides. A negative
value gives a relative boost to the left side; a positive value
boosts the right side.
Default
0
Object Model Reference
[window.] document.getElementsByTagName("bgsound")[0].balance
Defines the number of times the sound plays. If the attribute is
absent or is present with any value other than -1,
the sound plays at least once. Assigning a value of
-1 means that the sound plays until the page is
unloaded. Contrary to Microsoft's Internet Explorer
SDK information, there does not appear to be a way to precache the
sound without having it start playing.
Example
<bgsound src="tunes/mazeppa.mid" loop="3">
Value
No value assignment necessary for a single play. A value of
0 still causes a single play. Values above zero
play the sound the specified number of times. Assign
-1 to have the sound play indefinitely.
Default
-1
Object Model Reference
[window.] document.getElementsByTagName("bgsound")[0].loop
A URL that points to the sound file to be played. The type of sound
file that can be played is limited only by the audio facilities of
the browser. Common audio formats, including MIDI, are supported in
Internet Explorer without further plugin installation.
Example
<bgsound src="tunes/beethoven.mid">
Value
Any valid URL, including complete and relative URLs. The file must be
in a MIME type supported by Internet Explorer or a plugin.
Default
None.
Object Model Reference
[window.] document.getElementsByTagName("bgsound")[0].src
volume | NN n/a IE 4 HTML n/a |
volume="signedInteger" | Optional | An integer that defines how loud the background sound plays relative
to the maximum sound output level as adjusted by user preferences in
the client computer. Maximum volume—a setting of zero—is
only as loud as the user has set in the Sound control panel. Attribute adjustments are
negative values as low as -10,000 (although most users lose the sound
at a value much higher than -10,000).
Example
<bgsound src="tunes/beethoven.mid" volume="-500">
Value
A signed integer value between -10,000 and 0.
Default
0
Object Model Reference
[window.] document.getElementsByTagName("bgsound")[0].volume
<big> | NN all IE all HTML 3.2 |
<big>...</big> | HTML End Tag: Required | The big element—one of several font style
elements in HTML 4—renders its content in the next font size
(in HTML's 1 through 7 scale) larger than the
previous body font size. If you nest big elements,
the effects on the more nested elements are cumulative, with each
nested level rendered one size larger than the next outer element.
Default font size is dependent upon the browser, operating system,
and user preferences settings. For more precise font size rendering,
use style sheet rules.
Example
<p>This product is <big>new</big> and <big>improved</big>!</p>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<blink> | NN <6 IE n/a HTML n/a |
<blink>...</blink> | HTML End Tag: Required | The blink element is Marc
Andreessen's contribution to horrifying web pages.
All content of the element flashes on and off uncontrollably in a
distracting manner. The more content you place inside the element,
the more difficult it is to read between the flashes. Please
don't use this tag. I beg you. This element does not
have any attributes or event handlers, and it did not survive the
migration to Version 6.
Example
<blink>I dare you to read this...and not look at it.</blink>
<blockquote> | NN all IE all HTML all |
<blockquote>...</blockquote> | HTML End Tag: Required | The blockquote element is intended to set off a
long quote inside a document. Traditionally, the
blockquote element has been rendered as an
indented block, with wider left and right margins (about 40 pixels
each), plus some extra whitespace above and below the block. Browsers
will likely continue this type of rendering, although you are
encouraged to use style sheets to create such displays (with or
without the blockquote element). For inline
quotations, see the q element.
Example
<blockquote>Four score and seven years ago...
shall not perish from the earth</blockquote>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
Element-Specific Event Handler Attributes
None.
A URL pointing to an online source document from which the quotation
is taken. This is not in any way a mechanism for copying or
extracting content from another document. Presumably, this HTML 4
recommendation is to encourage future browsers and search engines to
utilize a reference to online source material for the benefit of
readers and surfers. The Properties
choice for Netscape 6's context menu for this
element displays a small window that includes an active link to the
URL assigned to the attribute. Version 6 browsers provide no other
functionality for this attribute.
Value
Any valid URL to a document on the World Wide Web, including absolute
or relative URLs.
Default
None.
Element-Specific Event Handler Attributes
None.
<body> | NN all IE all HTML all |
<body>...</body> | HTML End Tag: Optional | After all of the prefatory material in the head
portion of an HTML file, the body element contains
the genuine content of the page that the user sees in the browser
window (or may hear from browsers that know how to speak to users).
Before style sheets, the body element was the
place where page authors could specify document-wide color and
background schemes. A great many favorite attributes covering these
properties are deprecated in HTML 4, in favor of style sheet rules
that may be applied to the body element. Support
for all these attributes, however, will remain in mainstream browsers
for years to come.
The body element is also where
window object event handler attributes are placed.
For example, a window object as defined in most
document object models has an onload event handler
that fires when a document has finished loading into the current
window or frame. Assigning that event handler as an element attribute
is done in the body element.
Although it may appear from a variety of implications that the
body element is the document
object, this is not true. The document object has
additional properties (such as the document.title)
that are defined outside of the body element in an
HTML document. In a W3C-DOM-aware browser, the document node tree
puts more distance between the root document node
and the body element: the
document node is the parent of the
html element; the html element
is the parent of both the head and
body elements.
Example
<body background="watermark.jpg" onLoad="init( );">
...
</body>
Object Model Reference
[window.]document.body
Element-Specific Attributes
alink
|
background
|
bgcolor
|
bgproperties
|
bottommargin
|
leftmargin
|
link
|
marginheight
|
marginwidth
|
nowrap
|
rightmargin
|
scroll
|
text
|
topmargin
|
vlink
|
Element-Specific Event Handler Attributes
Handler
|
NN
|
IE
|
HTML
|
onafterprint
|
n/a
|
5
|
n/a
|
onbeforeprint
|
n/a
|
5
|
n/a
|
onload
|
2
|
3
|
4
|
onresize
|
4
|
4
|
n/a
|
onscroll
|
n/a
|
4
|
n/a
|
onselect
|
n/a
|
4
|
n/a
|
onunload
|
2
|
3
|
4
|
alink | NN all IE all HTML 3.2 |
alink="colorTripletOrName" | Optional | Establishes the color of a hypertext link when it is activated (being
clicked on) by the user. This is one of three states for a link:
unvisited, active, and visited. The color is applied to the link text
or border around an image or object embedded within an
a element. This attribute is deprecated in favor
of the CSS :active pseudo-class style rule for an
a element, as described in Chapter 11.
Example
<body alink="#FF0000">...</body>
Value
A hexadecimal triplet or plain-language color name. See Appendix A for acceptable plain-language color names.
Default
#FF0000 (typically).
Object Model Reference
[window.]document.alinkColor
[window.]document.body.aLink
background | NN all IE all HTML 3.2 |
Specifies an image file that is used as a backdrop to the text and
other content of the page. Unlike normal images that get loaded into
browser content, a background image loads in its original size
(without scaling) and tiles to fill the available document space in
the browser window or frame. Smaller images usually download faster
but are obviously repeated more often in the background. Animated
GIFs are also allowable but very distracting to the reader. When
selecting a background image, be sure it is very muted in comparison
to the main content so that the content stands out clearly.
Background images, if used at all, should be extremely subtle or
occupy space free of other content.
This attribute is deprecated in HTML 4 in favor of the
background style attribute.
Example
<body background="watermark.jpg">...</body>
Value
Any valid URL to an image file, including complete and relative URLs.
Default
None.
Object Model Reference
[window.]document.body.background
bgcolor | NN all IE all HTML 3.2 |
bgcolor="colorTripletOrName" | Optional | Establishes a fill color (behind the text and other content) for the
entire document. If you combine a bgcolor and
background, any transparent areas of the
background image let the background color show through. This
attribute is deprecated in HTML 4 in favor of the
background-color style attribute.
Example
<body bgcolor="tan">...</body>
Value
A hexadecimal triplet or plain-language color name. A setting of
empty is interpreted as "#000000" (black). See
Appendix A for acceptable plain-language color
names.
Default
Varies with browser, browser version, and operating system.
Object Model Reference
[window.]document.bgColor
[window.]document.body.bgColor
bgproperties | NN n/a IE 3 HTML n/a |
bgproperties="property" | Optional | An Internet Explorer attribute that lets you define whether the
background image (set with the background
attribute or style sheet) remains in a fixed position or scrolls as a
user scrolls the page. This can provide both intriguing and odd
effects for the user. When the background image is set to remain in a
fixed position, scrolled content flows past the background image very
much like film credits roll past a background image on the screen.
Example
<body background="watermark.jpg" bgproperties="fixed">...</body>
Value
If set to "fixed", the image does not scroll. Omit
the attribute or set it to an empty string ("") to
let the image scroll with the content.
Default
None.
Object Model Reference
[window.]document.body.bgProperties
bottommargin | NN n/a IE 4 HTML n/a |
bottommargin="integer" | Optional | Establishes the amount of blank space between the very end of the
content and the bottom of a scrollable page. The setting has no
visual effect if the length of the content or size of the window does
not cause the window to scroll. The default value is for the end of
the content to be flush with the end of the document, but in the
Macintosh version of Internet Explorer, there is about a 10-pixel
margin visible even when the attribute is set to zero. Larger sizes
are reflected properly. This attribute offers somewhat of a shortcut
to setting the margin-bottom style sheet attribute
for the body element.
Example
<body bottommargin="20">...</body>
Value
A string value of the number of pixels of clear space at the bottom
of the document. A value of an empty string is the same as zero.
Default
0
Object Model Reference
[window.]document.body.bottomMargin
leftmargin | NN 6 IE 3 HTML n/a |
leftmargin="integer" | Optional | Establishes the amount of blank space between the left edge of the
content area of a window and the left edge of the content. This
attribute offers somewhat of a shortcut to setting the
margin-left style sheet attribute for the
body element. As the outermost parent container in
the renderable element hierarchy, this attribute setting fixes the
left margin context for all nested elements in the document.
Example
<body leftmargin="25">...</body>
Value
A string value of the number of pixels of clear space at the left
margin of the document. A value of an empty string is the same as
zero.
Default
10 (IE/Windows); 8
(IE/Macintosh).
Object Model Reference
[window.]document.body.leftMargin
link | NN all IE all HTML 3.2 |
link="colorTripletOrName" | Optional | Establishes the color of a hypertext link that has not been visited
(i.e., the URL of the link is not in the browser's
cache). This is one of three states for a link: unvisited, active,
and visited. The color is applied to the link text or border around
an image or object embedded within an a element.
This attribute is deprecated in favor of the :link
pseudo-class style rule for an a element, as
described in Chapter 11).
Example
<body link="#00FF00">...</body>
Value
A hexadecimal triplet or plain-language color name. See Appendix A for acceptable plain-language color names.
Default
#0000FF
Object Model Reference
[window.]document.linkColor
[window.]document.body.link
marginheight, marginwidth | NN 4 IE n/a HTML n/a |
marginheight="integer"marginwidth="integer" | Optional | Shortcut attributes to set the body's margins in
lieu of CSS style sheets. Setting marginheight to
a pixel value establishes a margin setting above and below the body
content; marginwidth sets margins to the left and
right of the body.
Example
<body marginheight="20" marginwidth="10">...</body>
Value
A string value of the number of pixels of clear space at each of the
two sides affected by each attribute. A value of an empty string is
the same as zero.
Default
0
nowrap | NN n/a IE 4 HTML n/a |
Controls whether wide content should wrap within the body width.
Example
<body nowrap>...</body>
Value
The presence of the attribute sets its value to
true.
Default
false
Object Model Reference
[window.]document.body.noWrap
rightmargin | NN n/a IE 4 HTML n/a |
rightmargin="integer" | Optional | Establishes the amount of blank space between the right edge of the
content area of a window and the right edge of the content. This
attribute offers somewhat of a shortcut to setting the
margin-right style sheet attribute for the
body element. As the outermost parent container in
the renderable element hierarchy, this attribute setting fixes the
right margin context for all nested elements in the document. Be
aware that IE on the Mac does not let content come as close to the
right edge of the window as the Windows version.
Example
<body rightmargin="25">... </body>
Value
A string value of the number of pixels of clear space at the right
margin of the document. A value of an empty string is the same as
zero.
Default
10 (Windows); 0 (Macintosh).
Object Model Reference
[window.]document.body.rightMargin
scroll | NN n/a IE 4 HTML n/a |
scroll="featureSwitch" | Optional | Controls the presence of scrollbars when the content space exceeds
the size of the current window. Without scrollbars, if you want your
users to move around the page, you have to provide some scripted
method of adjusting the scroll of the window. Be aware that Internet
Explorer for the Mac always shows scrollbars when the document is too
large for the window, even when the scroll
attribute is set to no. For more modern control
over scrollbars, use the overflow CSS attribute
(plus IE-specific overflowX and
overflowY attributes).
Example
<body scroll="no">...</body>
Value
Constant values yes or no
(case-insensitive).
Default
yes
Object Model Reference
[window.]document.body.scroll
text | NN all IE all HTML 3.2 |
text="colorTripletOrName" | Optional | Establishes the color of body content in the document. Colors of
individual elements within the document can override the
document-wide setting. Because the default background color of
browsers varies widely with browser brand, version, and operating
system, it is advisable to set the bgcolor
attribute (or equivalent style sheet rule) in concert with the
document's text color. This attribute is deprecated
in favor of the color style sheet attribute.
Example
<body bgcolor="#FFFFFF" text="#c0c0c0">...</body>
Value
A hexadecimal triplet or plain-language color name. See Appendix A for acceptable plain-language color names.
Default
#000000 (black).
Object Model Reference
[window.]document.fgColor
[window.]document.body.text
topmargin | NN 6 IE 3 HTML n/a |
topmargin="integer" | Optional | Establishes the amount of blank space between the top edge of the
content area of a window and the top edge of the content. This
attribute offers somewhat of a shortcut to setting the
margin-top style sheet attribute for the
body element. As the outermost parent container in
the renderable element hierarchy, this attribute setting fixes the
top margin context for all nested elements in the document. Setting
the topmargin attribute to zero or an empty string
("") pushes the content to the very top of the
document content region.
Example
<body topmargin="0">... </body>
Value
A string value of the number of pixels of clear space at the top of
the document. A value of an empty string is the same as zero.
Default
15 (IE/Windows); 8
(IE/Macintosh).
Object Model Reference
[window.]document.body.topMargin
vlink | NN all IE all HTML 3.2 |
vlink="colorTripletOrName" | Optional | Establishes the color of a hypertext link after it has been visited
by a user (and the destination page is still in the
browser's cache). This is one of three states for a
link: unvisited, active, and visited. The color is applied to the
link text or border around an image or object embedded within an
a element. This attribute is deprecated in favor
of the :visited pseudo-class style rule for an
a element, as described in Chapter 11).
Example
<body vlink="teal">...</body>
Value
A hexadecimal triplet or plain-language color name. See Appendix A for acceptable plain-language color names.
Default
#551a8b (NN); #800080
(IE/Windows); #006010 (IE/Macintosh).
Object Model Reference
[window.]document.vlinkColor
[window.]document.body.vLink
<br> | NN all IE all HTML all |
<br> | HTML End Tag: Forbidden | The br element forces a visible line break
(carriage return and line feed) wherever its tag appears in the
document. Browsers tend to honor the br element as
a genuine line break, whereas paragraphs defined by the
p element are given more vertical space between
elements on the page. If the text containing the
br element is wrapped around a floating image or
other object, you can direct the next line (via the
clear attribute or style sheet equivalent) to
start below the object, rather than on the next line of the wrapped
text.
Example
<p>I think that I shall never see<br>A poem lovely as a tree.</p>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
Element-Specific Event Handler Attributes
None.
clear | NN all IE all HTML 3.2 |
The clear attribute tells the browser how to treat
the next line of text following a br element if
the current text is wrapping around a floating image or other object.
The value you use depends on the side of the page to which one or
more inline images are pegged and how you want the next line of text
to be placed in relation to those images.
This attribute is deprecated in HTML 4 in favor of the
clear style sheet attribute in CSS2.
Example
<br clear="left">
Value
Four string constants: all |
left | none |
right. HTML 4.0 includes what should be the
default value: none. This value is listed in IE 3
documentation, but not for IE 4. You can set the property to
none, and the browser either responds to the value
or ignores it (yielding the same results).
Default
none
Object Model Reference
[window.]document.getElementById(elementID).clear
<button>...</button> | HTML End Tag: Required | The button element is patterned after the
input element (of types button,
submit, and reset) but carries
some extra powers, particularly when used as a submit-type button.
Content for the button's label goes between the
element's start and end tags, rather than being
assigned as an attribute. Other elements can be used to generate the
label content, including an img element if so
desired (although client-side image maps of such images are strongly
discouraged by the W3C). Although you can assign a style sheet to a
button element, you can also wrap the label
content inside an element (such as a span) and
assign or override style rules just for that content. Both style
sheet mechanisms permit the button label to use custom fonts and
styles.
When a button element is assigned a
type of submit, the browser
submits the button's name and
value attributes to the server as a name/value
pair, like other form elements. No special form handling is conveyed
by a button when other types are specified.
In theory, a button element should be embedded
within a form element. In practice, browsers have
no problem rendering a free-standing button
element. This might be acceptable when no related form elements (such
as text boxes) need to be referenced by scripts associated with the
button. Some scripting shortcuts (reading the form
property of the event object's
srcElement or target
properties) simplify the scripted interactivity between form
elements.
The W3C implemented this input element variant to
offer browser makers a chance to create a different, richer-looking
button. In practice, recent IE browsers for both Windows and
Macintosh render identical buttons. Netscape 6 tends to use less
horizontal padding around the label of a button
element by default.
Example
<button type="button" onClick="doSomething( );">Click Here</button>
<button type="submit" id="sender" value="infoOnly">Request Info</button>
<button type="reset"><img src="clearIt.gif" height="20" width="18"></button>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
datafld
|
dataformatas
|
datasrc
|
name
|
type
|
value
|
|
|
|
|
Element-Specific Event Handler Attributes
Handler
|
NN
|
IE
|
HTML
|
onafterupdate
|
n/a
|
4
|
n/a
|
onbeforeupdate
|
n/a
|
4
|
n/a
|
onrowenter
|
n/a
|
4
|
n/a
|
onrowexit
|
n/a
|
4
|
n/a
|
datafld | NN n/a IE 4 HTML |4| |
datafld="columnName" | Optional | Used with IE data binding to associate a remote data source column
name with the label of a button. The data source column must be
either plain text or HTML (see dataformatas). A
datasrc attribute must also be set for the
button element. Works only with text file data
sources in IE 5/Mac.
This attribute was reserved in HTML 4, but was dropped in XHTML 1.0.
Example
<button type="button" datasrc="DBSRC3" datafld="label" onClick="getTopStory( );">
Latest News</button>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).dataFld
dataformatas | NN n/a IE 4 HTML |4| |
dataformatas="dataType" | Optional | Used with IE data binding, this attribute advises the browser whether
the source material arriving from the data source is to be treated as
plain text or as tagged HTML. This attribute setting depends entirely
on how the data source is constructed.
This attribute was reserved in HTML 4, but was dropped in XHTML 1.0.
Example
<button type="button" datasrc="DBSRC3"dataformatas="HTML" datafld="label"
onClick="getTopStory( );"> Latest News</button>
Value
IE recognizes two possible settings: text |
html.
Default
text
Object Model Reference
[window.]document.getElementById(elementID).dataFormatAs
datasrc | NN n/a IE 4 HTML n/a |
datasrc="dataSourceName" | Optional | Used with IE data binding to specify the ID of the
page's object element that loads
the data source object for remote data access. Content from the data
source is specified via the datafld attribute.
Works only with text file data sources in IE 5/Mac.
This attribute was reserved in HTML 4, but was dropped in XHTML 1.0.
Example
<button type="button" datasrc="DBSRC3" datafld="label"
onClick="getTopStory( );"> Latest News</button>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).dataSrc
name="elementIdentifier" | Optional | For a button element, the name
attribute can play two roles, depending on the
type attribute setting. For all
type attribute settings, the
name attribute lets you assign an identifier that
can be used in scripted references to the element (the
id attribute is the preferred way to reference the
element). For a button type of submit, the
name attribute is sent as part of the name/value
pair to the server at submit time.
Example
<button type="submit" name="sender" value="infoOnly">Request Info</button>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).name
type="buttonType" | Optional | Defines the internal style of button for the browser. A button style
is intended to be used to initiate scripted action via an event
handler. A "reset" style behaves
the same way as an input element whose
type attribute is set to reset,
returning all elements to their default values. A
"submit" style behaves the same way
as an input element whose type
attribute is set to submit. A
button element whose type
attribute is set to either reset or
submit must be associated with a form for its
implied action to be of any value to the page.
Example
<button type="reset"><img src="clearIt.gif" height="20" width="18"></button>
Value
Case-insensitive constant value from the following list of three:
button | reset |
submit.
Default
button
Object Model Reference
[window.]document.getElementById(elementID).type
Preassigns a value to a button element that is
submitted to the server as part of the name/value pair when the
element is a member of a form.
Example
<button name="connections" id="connections" value="ISDN">ISDN</button>
Value
Any text string.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).value
<caption> | NN all IE all HTML 3.2 |
<caption>...</caption> | HTML End Tag: Required | A caption element may be placed only inside a
table element (and immediately after the
<table> start tag) to denote the text to be
used as a caption for the table. A caption applies to the entire
table, whereas a table heading (th element)
applies to a single column or row of the table. Only one
caption element is recognized within a
table element.
A table caption is usually a brief description of the table. A longer
description may be written for the summary
attribute of a table element for browsers that use
text-to-speech technology. The primary distinguishing attribute of
the caption element is align.
Although deprecated in HTML 4, it lets you define where the caption
appears in relation to the actual table.
Example
<table ...>
<caption class="tableCaptions">
Table 3-2. Sample Inverse Framistan Values
</caption>
...
</table>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
Element-Specific Event Handler Attributes
None.
align | NN all IE all HTML 3.2 |
Determines how the caption is rendered in physical relation to the
table. Not all versions of all browsers support the full range of
possibilities for this attribute. Only top and
bottom are universal among supporting browsers.
Browsers typically render a caption above or below a table in the
running body font (unless modified by tag or style sheet) and
centered horizontally on the table. If the caption is wider than the
table, text is wrapped to the next line, maintaining center
justification.
The align attribute is deprecated in HTML 4.0 in
favor of the text-align and
vertical-align style sheet attributes.
Example
<caption align="top">Table II. Stock List</caption>
Value
Acceptable string values for this attribute vary with browser
version. Select the one(s) from the following table that work for
your deployment.
Value
|
IE 4+
|
NN 4
|
NN 6
|
HTML 4
|
bottom
|
•
|
•
|
•
|
•
|
center
|
•
|
-
|
-
|
-
|
left
|
•
|
-
|
•
|
•
|
right
|
•
|
-
|
•
|
•
|
top
|
•
|
•
|
•
|
•
|
For implementation details, see the discussion of text alignment
within a containing box in the Section 8.1.5 at
the beginning of this chapter.
Default
top (in IE, center if
valign attribute is also set).
Object Model Reference
[window.]document.getElementById(elementID).align
valign | NN n/a IE 3 HTML n/a |
The valign attribute was Internet
Explorer's early attribute for placing a table
caption above or below the table. Although this attribute is now a
part of the align attribute, IE's
special way of handling left,
center, and right values of the
align attribute give valign
something to do. For example, you can use valign
to set the caption below the table, and use
align="right" to right-align the caption at the
bottom. This combination is not possible with the HTML 4 attribute.
Example
<caption align="right" valign="bottom">Table 3-2. Fiber Content.</caption>
Value
Two possible case-insensitive values: bottom |
top.
Default
top
Object Model Reference
[window.]document.getElementById(elementID).valign
<center> | NN all IE all HTML 3.2 |
<center>...</center> | HTML End Tag: Required | The center element was introduced by Netscape and
became widely used before the W3C-sanctioned div
element came into being. It is clear, even from the HTML 3.2
documentation, that the HTML working group was never fond of this
element. Momentum, however, carried the day, and this element found
its way into the HTML 3.2 specification. The element is deprecated in
HTML 4 in favor of the div element with a style
sheet rule of text-align:center. In lieu of style
sheets (but still deprecated in HTML 4), you can substitute a
div element with
align="center".
Content of a center element is aligned along an
axis that runs down the middle of the next outermost containing
element—usually the body or
html element.
Example
<center>Don't do this.</center>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<cite> | NN all IE all HTML all |
<cite>...</cite> | HTML End Tag: Required | The cite element is one of a large group of
elements that the HTML 4 recommendation calls phrase
elements. Such elements assign structural meaning to a
designated portion of the document. A cite element
is one that contains a citation or reference to some other source
material. This is not an active link but simply notation indicating
what the element content is. Search engines and other HTML document
parsers may use this information for other purposes (assembling a
bibliography of a document, for example).
Browsers have free rein to determine how (or whether) to distinguish
cite element content from the rest of the
body element. Both Navigator and Internet Explorer
elect to italicize the text. Override the default with a style sheet
as you see fit.
Example
<p>Trouthe is the hyest thing that many may kepe.<br>
(Chaucer, <cite>The Franklin's Tale</cite>)</p>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<code> | NN all IE all HTML all |
<code>...</code> | HTML End Tag: Required | The code element is one of a large group of
elements that the HTML 4 recommendation calls phrase
elements. Such elements assign structural meaning to a
designated portion of the document. A code element
is one that is used predominantly to display one or more inline
characters representing computer code (program statements, variable
names, keywords, and the like).
Browsers have free rein to determine how (or whether) to distinguish
code element content from the rest of the
body element. Both Navigator and Internet Explorer
elect to render code element content in a
monospace font, usually in a slightly smaller font size than the
default body font (although it is not reduced in IE 4 for the
Macintosh). Override the default with a style sheet as you see fit.
Whitespace (including carriage returns) is treated the same way in
code element content as it is in the
browser's body element content.
Line breaks must be manually inserted with br
elements. See also the pre element for displaying
preformatted text that observes all whitespace entered in the source
code.
Example
<p>Initialize a variable in JavaScript with the <code>var</code> keyword.</p>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<col> | HTML End Tag: Forbidden | The col element provides shortcuts to assigning
widths and other characteristics (styles) to one or more subsets of
columns within a table or within a table's column
group. With this information appearing early in the
table element, a browser equipped to do so starts
rendering the table before all source code for the table has loaded
(the time at which it would otherwise perform all of its geographical
calculations).
You can use the col element in combination with
the colgroup element or by itself. The structure
depends on how you need to assign widths and styles to individual
columns or contiguous columns. A col element can
apply to multiple contiguous columns. By assigning an integer value
to the span attribute, you direct the browser to
apply the col element's width or
style settings to said number of contiguous columns. The
span attribute is similar to the
colgroup element's
colspan attribute. In concert with the
colgroup element, the col
element allows you to create a kind of subset of related columns
within a colgroup set.
No matter how you address the column structure of your table, the
total number of columns defined in all col and
colgroup elements should equal the physical number
of columns you intend for the table. The following three skeletal
examples specify HTML 4 tables with six columns:
<table>
<col span="6">
...
</table>
<table>
<col>
<col span="4">
<col>
...
</table>
<table>
<colgroup>
<col span="2"></colgroup>
<colgroup span="4">
...
</table>
HTML 4 specifications for the col element exceed
the implementation in IE and Navigator through Version 6. For
example, HTML 4 provides for alignment within a column to be around
any character, such as the decimal point of a money amount. This kind
of feature adds to the rationale behind the col
element. For example, you can have a table whose first three columns
are formatted one way, and fourth column is assigned a special style
with its own alignment characteristics:
<html>
<head>
<style type="text/css">
.colHdrs {color:black}
.normColumn {color:green}
.priceColumn {color:red}
</style>
</head>
<body>
<table>
<colgroup class="normColumn" span="3"></colgroup>
<col class="priceColumn" align="char" char=".">
<thead class="colHdrs">
<tr><th>Stock No.<th>In Stock<th>Description<th>Price</tr>
<tbody>
<tr><td>8832<td>Yes<td>Brass Frobnitz<td>$255.98</tr>
<tr><td>8835<td>No<td>Frobnitz (black)<td>$98</tr>
...
</table>
</body>
</html>
Because attributes of the col and
colgroup elements apply to the entire column, in
the preceding example the style sheet rule for the
thead overrides the color settings for the two
column styles for the rows enclosed by the thead
element. The preceding example works in IE 4 and later for Windows,
except for the alignment of the final column, which is ignored.
Support indicated here for Netscape 6 is based on the
browser's DOM implementation. The DOM reports to
scripts that the col element and its attributes
exist (reflected as properties). But as of Netscape 7, the element
does not perform its intended tasks. A later version will likely
connect the element's internal wiring.
Example
<col class="dateCols" width="15" align="right">
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
align
|
ch
|
char
|
charoff
|
choff
|
span
|
valign
|
width
|
|
|
Element-Specific Event Handler Attributes
None.
align="alignConstant" | Optional | Establishes the horizontal alignment characteristics of content
within column(s) covered by the col element. The
HTML 4 specification defines some values for the
align attribute that are not yet reflected in the
CSS specification. For example, there is no CSS equivalent for the
alignment by character. See the col element
description about Netscape 6 compatibility.
Example
<col class="dateCols" width="15" align="right">
Value
HTML 4 and IE have two sets of attribute values.
Value
|
IE
|
HTML 4
|
center
|
•
|
•
|
char
|
-
|
•
|
justify
|
-
|
•
|
left
|
•
|
•
|
right
|
•
|
•
|
The values center, left, and
right are self-explanatory (and may be replicated
through the CSS text-align attribute). The value
justify is intended to space content so that text
is justified down both left and right edges. For the value
char, the char attribute must
also be set to specify the character on which alignment revolves.
It is important to bear in mind that the align
attribute applies to every row of every column spanned by a
col element, including any th
element you specify for the table. If you want a different alignment
for the column header, override the setting with a separate
align attribute or text-align
style sheet attribute for the thead or individual
th elements.
Default
left
Object Model Reference
[window.]document.getElementById(elementID).align
The char attribute defines the text character used
as an alignment point for text within a column. This attribute is of
value only for the align attribute set to
"char". Microsoft documents a
ch attribute, which corresponds to the
standards-based char attribute. In any case, the
browser does not respond to either attribute. Netscape 7 has not yet
connected support for the char attribute.
Example
<col class="priceColumn" align="char" char=".">
Value
Any single text character.
Default
None.
charoff | NN 6 IE n/a HTML 4 |
The charoff attribute lets you set a specific
offset point at which the character specified by the
char attribute is to appear within a cell. This
attribute is provided in case the browser default positioning does
not meet with the design goals of the table. Microsoft documents a
choff attribute, which corresponds to the
standards-based charoff attribute. In any case,
the browser does not respond to either attribute. Netscape 7 has not
yet connected support for the charoff attribute.
Example
<col class="priceColumn" align="char" char="." charoff="80%">
Value
Any length value in pixels or percentage of cell space.
Default
None.
See charoff.
span="columnCount" | Optional | Defines the number of adjacent columns for which the
col element's attribute and style
settings apply. If this attribute is missing, the
col element governs a single column. You can
combine multiple col elements of different
span sizes as needed for your column subgrouping.
See the col element description about Netscape 6
compatibility.
Example
<col span="3">
Value
Integer value greater than zero.
Default
1
Object Model Reference
[window.]document.getElementById(elementID).span
valign="alignmentConstant" | Optional | Determines the vertical alignment of content within cells of the
column(s) covered by the col element. You can
override the vertical alignment for a particular cell anywhere in the
column. See the col element description about
Netscape 6 compatibility.
Example
<col valign="middle">
Value
Four constant values are recognized by both IE 4 and later for
Windows and HTML 4: top |
middle | bottom |
baseline. With top and
bottom, the content is rendered flush (or very
close to it) to the top and bottom of the table cell. Set to
middle (the default), the content floats perfectly
centered vertically in the cell. When one cell's
contents might wrap to multiple lines at common window widths
(assuming a variable table width), it is advisable to set the
valign attributes of all cells in the same row (or
all col elements) to baseline.
This assures that the character baseline of the first (or only) line
of a cell's text aligns with the other cells in the
row—usually the most aesthetically pleasing arrangement.
Default
middle
Object Model Reference
[window.]document.getElementById(elementID).vAlign
width="multiLength" | Optional | Defines the maximum width for the column(s) covered by the
col element. In practice (in IE 4 and later for
Windows, anyway), the browser won't render a column
narrower than the widest contiguous stretch of characters not
containing whitespace (e.g., the longest word). The precise measure
of such a column width, of course, depends on the font
characteristics of the content, as well. See the
col element description about Netscape 6
compatibility.
Example
<col width="100">
Value
Internet Explorer accepts length values for the
width in the form of pixel measures (without the
"px" unit) or percentage of
available horizontal space allocated to the entire table
(width="25%").
The HTML 4 specification introduces an additional length measurement
scheme to supplement the regular length measure. Called a
proportional length (also MultiLength), this
format features a special notation and geometry. It is best suited
for situations in which a col element is to be
sized based on the available width of the table space after all fixed
length and percentage lengths are calculated. Using the proportional
length notation (a number followed by an asterisk), you can direct
the browser to divide any remaining space according to proportion.
For example, if there is enough horizontal space on the page for 100
pixels after all other column width calculations are performed, three
col elements might specify
width attributes of 1*,
3*, and 1*. This adds up to a
total of five proportional segments. The 100 available pixels are
handed out to the proportional columns based on their proportion to
the whole of the remaining space: 20, 60, and 20 pixels,
respectively.
Default
Determined by browser calculation.
<colgroup> | NN 6 IE 3 HTML 4 |
<colgroup>...</colgroup> | HTML End Tag: Optional | The colgroup element provides shortcuts to
assigning widths and other characteristics (styles) to one or more
subsets of columns within a table. With this information appearing
early in the table element source code, a browser
equipped to do so starts rendering the table before all source code
for the table has loaded (at which time it would otherwise perform
all of its geographical calculations).
You can use the colgroup element in combination
with the col element or by itself. You may also
define a colgroup that has col
elements nested within to assist in defining subsets of columns that
share some attribute or style settings. The need for the
element's end tag is determined by the presence of
standalone col elements following the
colgroup element. For example, if you specify
column groupings entirely with colgroup elements,
end tags are not necessary:
<table>
<colgroup span="2" width="30">
<colgroup span="3" width="40">
<thead>
If you have a freestanding col element following
the colgroup element, you must clearly end the
colgroup element before the standalone
col element:
<table>
<colgroup class="leftCols">
<col width="30">
<col width="20">
</colgroup>
<col class="priceCol" width="25">
<thead>
...
The structure depends on how you need to assign widths and styles to
individual columns or contiguous columns. To create a column grouping
that consists of multiple adjacent columns, use the
span attribute. This is entirely different from
the colspan attribute of a td
element, which has the visual impact of joining adjacent cells
together as one. The span attribute helps define
the number of columns to be treated structurally as a group (for
assigning attribute and style sheet settings across multiple columns,
regardless of the column content).
No matter how you address the column structure of your table, the
total number of columns defined in all col and
colgroup elements should equal the physical number
of columns you intend for the table. The following three skeletal
examples specify HTML 4 tables with six columns:
<table>
<colgroup span="6">
...
</table>
<table>
<col>
<colgroup span="4">
<col>
...
</table>
<table>
<colgroup>
<col span="2">
</colgroup>
<colgroup span="4">
...
</table>
HTML 4 specifications for the colgroup element
exceed the implementation in IE for Windows and Navigator through
Version 6. For example, HTML 4 provides for alignment within a column
to be around any character, such as the decimal point of a money
amount. This kind of feature adds to the rationale behind the
col element (see the col
element for an example).
Syntactically, there is little difference between a
colgroup and col element. A
colgroup element, however, lends a structural
integrity to a group of columns that is rendered differently when the
containing table element specifies
rules="groups"; the browser draws rule lines
(standard table borders in IE) only between
colgroup elements, and not col
elements.
Support indicated here for Netscape 6 is based on the
browser's DOM implementation. The DOM reports to
scripts that the colgroup element and its
attributes exist (reflected as properties). But as of Netscape 7, the
element does not perform its intended tasks. A later version will
likely connect the element's internal wiring.
Example
<colgroup class="dateCols" width="15" align="right">
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
align
|
char
|
charoff
|
span
|
valign
|
width
|
|
|
|
|
Element-Specific Event Handler Attributes
None.
align="alignConstant" | Optional | Establishes the horizontal alignment characteristics of content
within column(s) covered by the colgroup element.
The HTML 4 specification defines settings for the
align attribute that are not yet reflected in the
CSS specification. For example, there is no CSS equivalent for the
alignment by character. See the colgroup element
description about Netscape 6 compatibility.
Example
<colgroup class="dateCols" width="15" align="right" span="3">
Value
HTML 4 and IE have two sets of attribute values.
Value
|
IE
|
HTML 4
|
center
|
•
|
•
|
char
|
-
|
•
|
justify
|
-
|
•
|
left
|
•
|
•
|
right
|
•
|
•
|
The values center, left, and
right are self-explanatory. The value
justify is intended to space content so that text
is justified down both left and right edges. For the value
char, the char attribute must
also be set to specify the character on which alignment revolves. In
the HTML 4 specification example, content that does not contain the
character appears to be right-aligned to the location of the
character in other rows of the same column.
It is important to bear in mind that the align
attribute applies to every row of a column, including any
th element you specify for the table. If you want
a different alignment for the column header, override the setting
with a separate align attribute or
text-align style sheet attribute for the
thead or individual th
elements.
Default
left
Object Model Reference
[window.]document.getElementById(elementID).align
The char attribute defines the text character used
as an alignment point for text within a column. This attribute is of
value only for the align attribute set to
"char". Microsoft documents a
ch attribute, which corresponds to the
standards-based char attribute. In any case, the
browser does not respond to either attribute. Netscape 7 has not yet
connected support for the char attribute.
Example
<colgroup class="priceCols" align="char" char="." span="2">
Value
Any single text character.
Default
None.
charoff | NN 6 IE n/a HTML 4 |
The charoff attribute lets you set a specific
offset point at which the character specified by the
char attribute is to appear within a cell. This
attribute is provided in case the browser default positioning does
not meet with the design goals of the table. Microsoft documents a
choff attribute, which corresponds to the
standards-based charoff attribute. In any case,
the browser does not respond to either attribute. Netscape 7 has not
yet connected support for the charoff attribute.
Example
<colgroup class="priceColumn" align="char" char="." charoff="80%" span="2">
Value
Any length value in pixels or percentage of cell space.
Default
None.
span="columnCount" | Optional | Defines the number of adjacent columns for which the
colgroup element's attribute and
style settings apply. If this attribute is missing, the
colgroup element governs a single column. You can
combine multiple colgroup elements of different
span sizes as needed for your column subgrouping.
See the colgroup element description about
Netscape 6 compatibility.
Example
<colgroup span="3">
Value
Integer value greater than zero.
Default
1
Object Model Reference
[window.]document.getElementById(elementID).span
valign="alignmentConstant" | Optional | Determines the vertical alignment of content within cells of the
column(s) covered by the colgroup element. You can
override the vertical alignment for a particular cell anywhere in the
column. See the colgroup element description about
Netscape 6 compatibility.
Example
<colgroup valign="middle">
Value
Four constant values are recognized by both IE 4 and HTML 4:
top | middle |
bottom | baseline. With
top and bottom, the content is
rendered flush (or very close to it) to the top and bottom of the
table cell. Set to middle (the default), the
content floats perfectly centered vertically in the cell. When one
cell's contents might wrap to multiple lines at
common window widths (assuming a variable table width), it is
advisable to set the valign attributes of all
cells in the same row (or all colgroup elements)
to baseline. This assures that the character
baseline of the first (or only) line of a cell's
text aligns with the other cells in the row—usually the most
aesthetically pleasing arrangement.
Default
middle
Object Model Reference
[window.]document.getElementById(elementID).vAlign
width="multiLength" | Optional | Defines the maximum width for the column(s) covered by the
colgroup element. In practice (in IE 4 and later
for Windows, anyway), the browser won't render a
column narrower than the widest contiguous stretch of characters not
containing whitespace (e.g., the longest word). The precise measure
of such a column width, of course, depends on the font
characteristics of the content, as well. See the
colgroup element description about Netscape 6
compatibility.
Example
<colgroup width="100">
Value
Internet Explorer accepts length values for the
width in the form of pixel measures (without the
"px" unit) or percentage of
available horizontal space allocated to the entire table
(width="25%").
An alternate variation of the proportional length value is described
in the HTML 4.0 specification. For a colgroup
element, you can specify width="0*" to instruct
the browser to render all columns according to the minimum width
necessary to display the content of the cells in the column. For a
browser to make this calculation, it must load all table contents,
thus eliminating the possibility of incremental rendering of a long
table. For more information about proportional lengths, see the
width attribute of the col
element.
Default
Determined by browser calculation.
<comment> | NN n/a IE all HTML n/a |
<comment>...</comment> | HTML End Tag: Required | The comment element is an artifact of early
Internet Explorer browsers. It was intended as a plain-language tag
alternate to the <!--comment--> comment
element. IE does not render content inside the
comment element, but all other browsers do. Do not
use this element. Further details are omitted here to reduce the
incentive to use the element.
<dd> | NN all IE all HTML all |
<dd>...</dd> | HTML End Tag: Optional | The dd element is a part of the
dl, dt, dd
triumvirate of elements used to create a definition list in a
document. The entire list is bracketed by the dl
element's tags. Each definition term is denoted by a
leading dt element tag, and the definition for the
term is denoted by a leading dd element tag. A
schematic of a definition list sequence for three items looks as
follows:
<dl>
<dt>Term 1</dt>
<dd>Definition 1</dd>
<dt>Term 2</dt>
<dd>Definition 2</dd>
<dt>Term 3</dt>
<dd>Definition 3</dd>
</dl>
A dt element is an inline element, whereas a
dd element can contain block-level content,
including bordered text, images, and other objects. End tags are
optional for both dt and dd
elements because the next start tag automatically signals the end of
the preceding element. The entire list, however, must close with an
end tag for the encapsulating dl element.
Although the HTML specification forces no particular way of rendering
a definition list, Navigator and Internet Explorer are in agreement
in left-aligning a dt element and indenting any
dd element that follows it. No special font
formatting or visual elements are added by the browser, but you are
free (if not encouraged) to assign styles as you like. If you want to
stack multiple terms and/or definitions, you can place multiple
dt and/or dd elements right
after each other in the source code.
Because HTML is being geared toward context-sensitive tagging, avoid
using definition lists strictly as a formatting trick (to get some
indented text). Use style sheets and adjustable margin settings to
accomplish formatting tasks.
In Navigator 4, any styles assigned to dt and
dd elements by way of the
class, id, or
style attribute do not work. If you wish to assign
the same style attributes to both the dt and
dd elements, assign the style to the
dl element; otherwise, wrap each
dt and dd element with a
span element whose styles the nested
dt and dd elements inherit.
This workaround is observed in IE 4, although it is not necessary for
IE-only documents.
Example
<dl>
<dt>Z-scale</dt>
<dd>A railroad modeling scale of 1:220. The smallest mass-produced
commercial model scale.</dd>
</dl>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<del>...</del> | HTML End Tag: Required | The del element and its companion,
ins, define a format that shows which segments of
a document's content have been marked up for
deletion (or insertion) during the authoring process. This is far
from a workflow management scheme, but in the hands of a supporting
WYSIWYG HTML authoring tool, these elements can assist in controlling
generational changes of a document in process.
Text contained by this element is rendered as a strikethrough style
(whereas ins elements are underlined). The HTML 4
specification includes two potentially useful attributes for
preserving hidden information about the date and time of the
alteration and some descriptive text about the change.
Example
<p>Four score and
<del cite="Fixed the math">eight</del><ins>seven</ins> years ago...</p>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
Element-Specific Event Handler Attributes
None.
A description of the reason for the change or other notation to be
associated with the element, but normally hidden from view. In
Netscape 6, the context menu for such an element contains a Properties choice, which leads to a displayed
list of attributes and their values for the visitor. Or, your DHTML
scripts can access the information through the element
object's cite property, and add
value to the presentation.
Example
<del cite="Fixed the math --A.L.">eight</del>
Value
Any string of characters. The string must be inside a matching pair
of (single or double) quotation marks.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).cite
datetime="datetimeString" | Optional | The date and time the deletion was made. This information is most
likely to be inserted into a document with an HTML authoring tool
designed to track content insertions and deletions. Data from this
attribute can be recalled later as an audit trail to changes of the
document. There can be only one datetime attribute
value associated with a given del element. In
Netscape 6, the context menu for such an element contains a Properties choice, which leads to a displayed
list of attributes and their values for the visitor. Or, your DHTML
scripts can access the information through the element
object's dateTime property, and
add value to the presentation.
Example
<del datetime="2001-09-11T08:56:00-04:00">SomeDeleteTextHere</del>
Value
The datetime attribute requires a value in a
special date-time format that conveys information about the date and
time in such a way that the exact moment can be deduced from any time
zone around the world. Syntax for the format is as follows:
yyyy-MM-ddThh:mm:ssTZD.
- yyyy
-
Four-digit year
- MM
-
Two-digit month (01 through 12)
- dd
-
Two-digit date (01 through 31)
- T
-
Uppercase "T" to separate date from
time
- hh
-
Two-digit hour in 24-hour time (00 through 23)
- mm
-
Two-digit minute (00 through 59)
- ss
-
Two-digit second (00 through 59)
- TZD
-
Time Zone Designator
There are two formats for the Time Zone Designator. The first is
simply the uppercase letter "Z",
which stands for UTC (Coordinated Universal Time—also called
"Zulu"). The other format indicates
the offset from UTC that the time shown in
hh:mm:ss represents. This time offset
consists of a plus or minus symbol and another pair of
hh:mm values. For time zones west of
Greenwich Mean Time (which, for all practical purposes is the same as
UTC), the operator is a negative sign because the main
hh:mm:ss time is earlier than UTC; for
time zones east of GMT, the offset is a positive value. For example,
Pacific Standard Time is eight hours earlier than UTC: when it is
6:00 P.M. in the PST zone, it is 2:00 A.M. the next morning at UTC.
Thus, the following examples all represent the exact same moment in
time (Time Zone Designator shown in boldface for clarification only):
2003-01-30T02:00:00Z
|
UTC
|
2003-01-29T21:00:00-05:00
|
Eastern Standard Time
|
2003-01-29T18:00:00-08:00
|
Pacific Standard Time
|
2003-01-30T13:00:00+11:00
|
Sydney, Australia
|
For more details about this way of representing time, see the
ISO-8601 standard.
Default
None.
<dfn>...</dfn> | HTML End Tag: Required | The dfn element is one of a large group of
elements that the HTML 4 recommendation calls phrase
elements. Such elements assign structural meaning to a
designated portion of the document. A dfn element
signifies the first usage of a term in a document (its defining
instance). A common technique in documents is to italicize an
important vocabulary term the first time it is used in a document.
This is generally the place in the document where the term is defined
so that it may be used in subsequent sentences with its meaning
understood. By default, mainstream browsers italicize all text within
a dfn element. You can, of course, easily define
your own style for dfn elements with a style sheet
rule.
Example
<p>Concerto composers usually provide a space for soloists to show off
technical skills while reminding the audience of various themes used
throughout the movement. This part of the concerto is called the <dfn>
cadenza</dfn>.</p>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<dir> | NN all IE all HTML all |
<dir>...</dir> | HTML End Tag: Required | The original idea of the dir element was to allow
browsers to generate multicolumn lists of items. Virtually every
browser, however, treats the dir element the same
as a ul element, to present an unordered single
column list of items (usually preceded by a bullet). The
dir element is deprecated in HTML 4 and does not
validate against strict HTML 4 or XHTML DTDs. You should be using the
ul element, in any case, because you are assured
backward compatibility and forward compatibility should this element
ever disappear from the browser landscape entirely. Everything said
here also applies to the deprecated menu element.
Example
Common DB Connector Types:
<dir>
<li>DB-9</li>
<li>DB-12</li>
<li>DB-25</li>
</dir>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
Element-Specific Event Handler Attributes
None.
compact | NN 6 IE 3 HTML 3.2 |
A Boolean attribute originally designed to let browsers render the
list in a more compact style than normal (smaller line spacing
between items). In practice, mainstream browsers do not adjust their
rendering in response to this attribute.
Example
<dir compact>...</dir>
Value
The presence of this attribute makes its value
true.
Default
false
<div> | NN all IE all HTML 3.2 |
<div>...</div> | HTML End Tag: Required | The div element gives structure and context to any
block-level content in a document. Unlike some other structural
elements that have very specific connotations attached to them (the
p element, for instance), the author is free to
give meaning to each particular div element by
virtue of the element's attribute settings and
nested content. Each div element becomes a generic
block-level container for all content within the required start and
end tags.
It is most convenient to use the div element as a
wrapper for multielement content that is to be governed by a single
style sheet rule. For example, if a block of content includes three
paragraphs, rather than assign a special font style to each of the
p elements, you can wrap all three
p elements with a single div
element whose style sheet defines the requested font style. Such a
style sheet could be defined as an inline style
attribute of the div element or assigned via the
class or id attribute,
depending on the structure of the rest of the document.
div elements are block-level elements. If you need
an arbitrary container for inline content, use the
span element, instead.
Example
<div class="sections" id="section3">...</div>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
align
|
datafld
|
dataformatas
|
datasrc
|
nowrap
|
Element-Specific Event Handler Attributes
None.
align="alignmentConstant" | Optional | See details for horizontal alignment within a block element in the
Section 8.1.5 at
the beginning of this chapter.
Example
<div align="center">Part IV</div>
Value
Constant value. Navigator 4 and later and Internet Explorer 4 and
later (Windows) recognize all four constants specified in loose HTML
4: center | left |
right | justify. IE 4 for the
Macintosh does not recognize the justify setting.
Default
left or right, depending on
direction of current language.
Object Model Reference
[window.]document.getElementById(elementID).align
datafld | NN n/a IE 4 HTML |4| |
datafld="columnName" | Optional | Used with IE data binding to associate a remote data source column
name with the HTML content of a div element. The
data source column must be HTML (see
dataformatas). datasrc and
dataformatas attributes must also be set for the
div element. Works only with text file data
sources in IE 5/Mac.
This attribute was reserved in HTML 4, but was dropped in XHTML 1.0.
Example
<div datasrc="DBSRC3" datafld="sec3" dataformatas="HTML"></div>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).dataFld
dataformatas | NN n/a IE 4 HTML |4| |
dataformatas="dataType" | Optional | Used with IE data binding, this attribute advises the browser whether
the source material arriving from the data source is to be treated as
plain text or as tagged HTML. A div element should
receive data only in HTML format. Works only with text file data
sources in IE 5/Mac.
This attribute was reserved in HTML 4, but was dropped in XHTML 1.0.
Example
<div datasrc="DBSRC3" datafld="sec3" dataformatas="HTML"></div>
Value
IE recognizes two possible settings: text |
html
Default
text
Object Model Reference
[window.]document.getElementById(elementID).dataFormatAs
datasrc | NN n/a IE 4 HTML |4| |
datasrc="dataSourceName" | Optional | Used with IE data binding to specify the ID of the
page's object element that loads
the data source object for remote data access. Content from the data
source is specified via the datafld attribute.
Works only with text file data sources in IE 5/Mac.
This attribute was reserved in HTML 4, but was dropped in XHTML 1.0.
Example
<div datasrc="DBSRC3" datafld="sec3" dataformatas="HTML"></div>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).dataSrc
nowrap | NN n/a IE 4 HTML n/a |
The nowrap attribute, unique to IE/Windows for
this element, overrides the normal block model for a div element.
When the attribute is turned on, text streams to the right unless
broken by other interlaced elements. Indiscriminate use may lead to
excessively wide pages that force users to scroll horizontally over
long distances.
Example
<div id="bigBlock" nowrap>...</div>
Value
The presence of the attribute sets its value to
true.
Default
false
<dl> | NN all IE all HTML all |
<dl>...</dl> | HTML End Tag: Required | The dl element is a part of the
dl, dt, dd
triumvirate of elements used to create a definition list in a
document. The entire list is bracketed by the dl
element's tags. Each definition term is denoted by a
leading dt element tag, and the definition for the
term is denoted by a leading dd element tag. A
schematic of a definition list sequence for three items looks like
the following:
<dl>
<dt>Term 1</dt>
<dd>Definition 1</dd>
<dt>Term 2</dt>
<dd>Definition 2</dd>
<dt>Term 3</dt>
<dd>Definition 3</dd>
</dl>
The entire list must close with an end tag for the encapsulating
dl element. Note that the dl
element is the container of the entire list, which means that
inheritable style sheet rules assigned to the dl
element apply to the nested dt and
dd elements. Unwanted inheritances can be
overridden in the dt and dd
elements.
Although the HTML specification forces no particular way of rendering
a definition list, Navigator and Internet Explorer are in agreement
in left-aligning a dt element and indenting any
dd element that follows it. No special font
formatting or visual elements are added by the browser, but you are
free (if not encouraged) to assign styles as you like. If you want to
stack multiple terms and/or definitions, you can place multiple
dt and/or dd elements right
after each other in the source code.
Because HTML is being geared toward context-sensitive tagging, avoid
using definition lists strictly as a formatting trick (to get some
indented text). Use style sheets and adjustable margin settings to
accomplish formatting.
Example
<dl>
<dt>Z-scale</dt>
<dd>A railroad modeling scale of 1:220. The smallest mass-produced
commercial model scale.</dd>
</dl>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
Element-Specific Event Handler Attributes
None.
compact | NN 3 IE 3 HTML 3.2 |
When set to true (by virtue of its presence in the
dl element tag), the compact
Boolean attribute instructs the browser to render a related
dt and dd pair on the same line
if space allows. The criterion for determining this space (as worked
out in both Navigator and Internet Explorer) is related to the amount
of indentation normally assigned to a dd element
(indentation size differs slightly with operating system). With
compact turned on, if the dt
element is narrower than the indentation space, the
dd element is raised from the line below and
displayed on the same line as its dt element.
Because the width of characters in proportional fonts varies so
widely, there is no hard-and-fast rule about the number of characters
of a dt element that lets the
dd element come on the same line. But this compact
styling is intended for dt elements consisting of
only a few characters. This attribute is deprecated in HTML 4, and
does not validate in strict HTML 4 or XHTML.
Example
<dl compact>ListItems</dl>
Value
Presence of the attribute name enables the feature.
Default
Off.
Object Model Reference
[window.]document.getElementById(elementID).compact
<!DOCTYPE> | NN all IE all HTML 3.2 |
<!DOCTYPE...> | HTML End Tag: Forbidden | The DOCTYPE element is not an HTML element, but
rather a comment in the Standard Generalized Markup Language (SGML)
format (as are so-called HTML comments in the <!-- ...
--> style). This element must be the first element in a
document, except as noted below for XHTML documents, and must always
precede the <html> tag element. It advises
the browser as to the document type definition (DTD) that the HTML
source code is designed to follow. All browsers have a default
document type that defines which elements and element attributes the
browser supports (and that the browser has the internal programming
to support—buggy or otherwise). Specifying a document type for
a more modern DTD does not empower an older browser to support
elements and attributes for which it is not coded. Conversely,
specifying a constricted DTD does not prevent a browser from
recognizing and supporting backward-compatible or proprietary
elements and attributes.
A DOCTYPE element contains several unlabeled
attribute values that specify such details as the name for the
outermost document tag (html for our purposes),
the organization responsible for the DTD, the address of the actual
DTD file (called a system identifier), a
plain-language name for the definition (including version number, if
necessary), and the like. For example, the following
DOCTYPE refers to an HTML 4.01 DTD that includes
all deprecated elements and attributes:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html401/loose.dtd">
The next example points to the XHTML 1.1 DTD, which does not include
deprecated items nor frames:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
Additionally, if you specify an XHTML DTD, you should include one of
the following SGML-processing instruction tags prior to the
DOCTYPE declaration:
<?xml version="1.0"?>
<?xml version="1.0" encoding="UTF-8"?>
The latter version includes a setting for character set encoding,
which may alternatively be set in a <meta>
tag. The W3C HTML and XHTML validators encourage documents to declare
their character-encoding type in one way or the other.
For the most part, web authors include a DOCTYPE
element to facilitate validation of the HTML source code prior to
publication on the Web. But some modern browsers behave slightly
differently based on the details of the DOCTYPE
comment at the start of the document. Both IE 6 and Netscape 6
operate in one of two "modes,"
depending on the details of the DOCTYPE attribute
values. One mode points to backward compatibility with
implementations that came before, and diverge from, the W3C
standards; the other mode causes the browser to behave more in
keeping with W3C recommendations. The differences between the two
modes lay primarily in fine layout details that are more carefully
defined in modern-day CSS and DOM specifications. For simple layouts,
you probably won't notice the difference in modes.
But if your pages rely upon style sheets or backgrounds for tables,
form control alignment (especially in tables), precise font sizing or
spacing, and, in IE, pixel-perfect CSS positioning with respect to
the document edges and positioned element sizes, you need to pay
attention to the DOCTYPE details in your
documents.
It is difficult to guide you through every compatibility detail, but
a couple of broad recommendations should keep you on track. First, if
you are pleased with the layouts of your current pages or templates,
you will probably be best served by continuing to use
DOCTYPE settings that keep you in
backward-compatible mode (the Mozilla engineers call it
"quirks" mode; Microsoft has no
particular name for the mode). But if you are generating new content,
especially for the newer browsers (ideally, Version 6 or later), you
should gravitate toward the
"strict" (Navigator) or
"standards-compatible" (IE) mode
settings.
The number of DOCTYPE attribute values in common
use today is mind boggling, and the rules that govern which
attributes force each browser into a particular mode are not 100% in
sync across browsers. But here are a few of the more common
DOCTYPE tags that force Version 6 browsers into
backward-compatible mode, regardless of browser:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 3.0//EN">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
A couple of points worth noting. First, all of the above examples
declare HTML DTDs no later than HTML 4.01, and none are XHTML.
Second, none of the above examples includes a system identifier URI
to a reference .dtd file. Also, if you omit the
DOCTYPE element entirely, the browser applies the
equivalent of the old internal DTDs.
Now here are common DOCTYPE tags that force
Version 6 browsers into the modern, standards-based mode:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
"http://www.w3.org/TR/REC-html40/loose.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Frameset//EN"
"http://www.w3.org/TR/REC-html40/frameset.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"
"http://www.w3.org/TR/REC-html40/strict.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
All HTML 4.x/strict and XHTML DTDs switch on standards-compatible
mode, with or without the URLs. Including the URL with HTML 4.x
transitional and frameset DTDs invokes the standards-compatible mode.
To learn more about the impact of the DTD choice on DOM and CSS
features in the latest browsers, see Chapter 9 (client- and
offset- properties, the body
object, the document.compatMode property) and
Chapter 10 (height and
width attributes). Appendix E
shows which HTML 4 elements and attributes are supported by each of
the most popular HTML 4.01 and XHTML 1.0 DTDs for validation
purposes.
Object Model Reference
[window.]document.firstChild
Element-Specific Attributes
Attributes are unlabeled.
Element-Specific Event Handler Attributes
None.
<dt> | NN all IE all HTML all |
<dt>...</dt> | HTML End Tag: Optional | The dt element is a part of the
dl, dt, dd
triumvirate of elements used to create a definition list in a
document. The entire list is bracketed by the dl
element's tags. Each definition term is denoted by a
leading dt element tag, and the definition for the
term is denoted by a leading dd element tag. A
schematic of a definition list sequence for three items looks like
the following:
<dl>
<dt>Term 1</dt>
<dd>Definition 1</dd>
<dt>Term 2</dt>
<dd>Definition 2</dd>
<dt>Term 3</dt>
<dd>Definition 3</dd>
</dl>
A dt element is an inline element, whereas a
dd element can contain block-level content,
including bordered text, images, and other objects. End tags are
optional in HTML for both dt and
dd elements because the next start tag
automatically signals the end of the preceding element. The entire
list, however, must close with an end tag for the encapsulating
dl element.
Although the HTML specification forces no particular way of rendering
a definition list, Navigator and Internet Explorer are in agreement
in left-aligning a dt element and indenting any
dd element that follows it. No special font
formatting or visual elements are added by the browser, but you are
free (if not encouraged) to assign styles as you like. If you want to
stack multiple terms and/or definitions, you can place multiple
dt and/or dd elements right
after each other in the source code.
Because HTML is being geared toward context-sensitive tagging, avoid
using definition lists strictly as a formatting trick (to get some
indented text). Use style sheets and adjustable margin settings to
accomplish formatting.
In Navigator 4, any styles assigned to dt and
dd elements by way of the
class, id, or
style attribute do not work. If you wish to assign
the same style attributes to both the dt and
dd elements, assign the style to the
dl element; otherwise, wrap each
dt and dd element with a
span element whose styles the nested
dt and dd elements inherit.
This workaround is observed in IE 4, although it is not necessary for
IE 4-only documents.
Example
<dl>
<dt>Z-scale</dt>
<dd>A railroad modeling scale of 1:220. The smallest mass-produced
commercial model scale.</dd>
</dl>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<em> | NN all IE all HTML all |
<em>...</em> | HTML End Tag: Required | The em element is one of a large group of elements
that the HTML 4 recommendation calls phrase
elements. Such elements assign structural meaning to a
designated portion of the document. An em element
is one that is to be rendered differently from running body text to
designate emphasis.
Browsers have free rein to determine how (or whether) to distinguish
em element content from the rest of the
body element. Both Navigator and Internet Explorer
elect to italicize the text. Override the default with a style sheet
as you see fit.
Example
<p>The night was dark, and the river's churning waters were <em>very</em>
cold.</p>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<embed> | NN 2 IE 3 HTML n/a |
<embed>...</embed> | HTML End Tag: Optional/Required | An embed element allows you to load media and file
types other than those natively rendered by the browser. Typically,
such external data requires a plugin or helper application to
properly load the data and display its file. Notice that this element
has been supported by both Navigator and Internet Explorer since
Versions 2 and 3, respectively, but the element never became a part
of the HTML standard vocabulary. The HTML 4 specification recommends
the object element as the one to load the kind of
external data covered by the embed element in the
browsers. Navigator 4 and later and Internet Explorer 4 and later
also support the object element, and you should
gravitate toward that element for embedded elements if your visitor
browser base can support it.
Bear in mind that for data types that launch plugins, the control
panel displayed for the data varies widely among browsers, operating
systems, and the plugins the user has installed for that particular
data type. It is risky business trying to carefully design a layout
combining a plugin's control panel and surrounding
text or other elements.
The list of attributes for the embed element is a
long one, but pay special attention to the browser compatibility
rating for each attribute. Because the plugin technologies for
IE/Windows, IE/Mac, and Navigator are not identical, neither are the
attribute sets. Even so, it is possible to assign an
embed element in one document that works on both
browser brands when the embedded element does not rely on an
attribute setting not supported in one of the browsers. Some plugins,
however, may require or accept attribute name/value pairs that are
not listed for this element. At least in the case of Navigator, all
attributes (including those normally ignored by the browser) and
their values are passed to the plugin. Therefore, you must also check
with the documentation for a plugin to determine what, if any, extra
attributes may be supported. The object element
gets around this object-specific attribute problem by letting you add
any number of param elements tailored to the
object.
The end tag is required in Internet Explorer but is optional in
Navigator.
Example
<embed name="jukebox" src="jazz.aif" height="100" width="200"></embed>
Object Model Reference
[window.]document.embeds[elementName]
[window.]document.getElementById(elementID)
Element-Specific Attributes
align
|
alt
|
height
|
hidden
|
name
|
pluginspage
|
pluginurl
|
src
|
type
|
units
|
width
|
|
|
|
|
Element-Specific Event Handler Attributes
None.
align | NN all IE 4 HTML n/a |
If the embedded object (or player control panel) occupies space on
the page, the align attribute determines how the
object is rendered in physical relation to the
element's next outermost container. If some
additional text is specified between the start and end tags of the
embed element, the align
attribute also affects how that text is rendered relative to the
object's rectangular space.
Most of the rules for alignment-constant values cited at the
beginning of this chapter apply to the embed
element. Precise layout becomes difficult because the HTML page
author usually isn't in control of the plugin
control panel that is displayed on the page. Dimensions for the
element that work fine for one control panel are totally
inappropriate for another.
Typically, align attributes are deprecated in HTML
4 in favor of the align style sheet attribute. But
if you are using the embed element for backward
compatibility, stick with the align attribute.
Example
<embed src="jazz.aif" align="left" height="100" width="200"></embed>
Value
Each browser defines a different set of values for this attribute.
Select the one(s) from the following table that work for your
deployment:
Value
|
NN
|
IE
|
absbottom
|
-
|
•
|
absmiddle
|
-
|
•
|
baseline
|
-
|
•
|
bottom
|
•
|
•
|
left
|
•
|
•
|
middle
|
•
|
•
|
right
|
•
|
•
|
texttop
|
-
|
•
|
top
|
•
|
•
|
Default
bottom
Object Model Reference
[window.]document.embeds[elementName].align
[window.]document.getElementById(elementID).align
alt="textMessage" | Optional | If Internet Explorer does not have the facilities to load and run the
external media, the text assigned to the alt
attribute is supposed to display in the document where the
embed element's tag appears.
Typically, this text provides advice on what the page visitor is
missing by not being able to load the data (although IE also presents
a dialog about how to get plugin information from an online source).
Use the alt attribute with care. If the external
data is not a critical part of your page's content,
you may just want the rest of the page to load without calling
attention to the missing media controller in lesscapable browsers.
The alternate message may be more disturbing to the user than a
missing media player.
The equivalent powers are available in Navigator with the
noembed element.
Example
<embed src="jazz.aif" alt="Sound media player" height="10" width="20"></embed>
Value
Any quoted string of characters.
Default
None.
height, width | NN 2 IE 3 HTML n/a |
height="length"
width="length" The size that an embedded object (or its plugin control panel)
occupies in a document is governed by the height
and width attribute settings. Some browser
versions might allow you to get away without assigning these
attributes, letting the plugin's own user interface
design determine the height and width of its visible rectangle. It is
best to specify the exact dimensions of a plugin's
control panel whenever possible. (Control panels vary with each
browser and even between different plugins for the same browser.) In
some cases, such as Navigator 4 for the Macintosh, the control panel
does not display if you fail to supply enough height on the page for
the control panel. If you assign values that are larger than the
actual control panel, the browser reserves that empty space on the
page, which could interfere with your intended page design.
Example
<embed src="jazz.aif" height="150" width="250"></embed>
Value
Positive integer values (optionally quoted) or percentage values
(quoted). You cannot entirely hide an embedded
object's control panel by setting values to zero
(one pixel always shows and occupies space), but you can reduce its
height and width to one pixel in each dimension. If you want to hide
a plugin, do so with DHTML by setting its positioning
display attribute to none.
Default
None.
Object Model Reference
[window.]document.embeds[i].height
[window.]document.getElementById(elementID).height
[window.]document.embeds[i].width
[window.]document.getElementById(elementID).width
hidden | NN <6 IE 4 HTML n/a |
hidden="true" | "false" | Optional | Predating style sheet borders, the hidden
attribute is a switch that lets you set whether the embedded
data's plugin control panel appears on the screen.
This might be desirable for background music under script control
(via Netscape's LiveConnect). When you set the
hidden attribute, the height
and width attributes are overridden.
Example
<embed src="soothing.aif" hidden="true"></embed>
Value
true | false
Default
false
Object Model Reference
[window.]document.embeds[i].hidden
[window.]document.getElementById(elementID).hidden
name="elementIdentifier" | Optional | If you are scripting a plugin (especially in Navigator via
LiveConnect), it is usually more convenient to create a reference to
the embedded element by using a unique name you assign to the item.
Thus, if you edit the page and move or delete multiple
embed elements on the page, you do not have to
worry about adjusting index values to array-style references
(document.embeds[embedName]).
Example
<embed name="jukebox" id="jukebox" src="jazz.aif" height="15" width="25"></embed>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.embeds[i].name
[window.]document.getElementById(elementID).name
pluginspage | NN <6 IE 4 HTML n/a |
pluginspage="URL" | Optional | If the MIME type of the data file assigned to the
embed element's
src attribute is not supported by an existing
plugin or helper application in the browser, the
pluginspage attribute is intended to provide a URL
for downloading and installing the necessary plugin. If you omit this
attribute, Navigator 4 presents a generic link to
Netscape's own resource listing of plugin vendors.
Example
<embed name="jukebox" src="jazz.aif" height="150" width="250"
pluginspage="http://www.giantco.com/plugin/install/index.html">
</embed>
Value
Any valid URL.
Default
None.
pluginurl | NN |4| IE n/a HTML n/a |
Navigator 4 (only) introduced the power (a feature called Smart
Update) to allow somewhat automatic installation of browser
components. If a user does not have the necessary plugin installed
for your embed element's data
type, the pluginurl can point to a Java Archive
(JAR) file that contains the plugin and digitally signed objects to
satisfy security issues surrounding automatic installation (via
Netscape's Java Installation Manager). A JAR file is
both digitally signed and compressed (very much along the lines of a
.zip file), and is created with the help of
Netscape's JAR Packager tool.
You can include both the pluginspage and
pluginurl attributes in an
embed element's tag to handle the
appropriate browser version. Navigator 2 and 3 respond to the
pluginspage attribute, whereas Navigator 4 gives
precedence to the pluginurl attribute when it is
present.
Example
<embed name="jukebox" src="jazz.aif" height="150" width="250"
pluginurl="http://www.giantco.com/plugin/install.jar">
</embed>
Value
Any valid URL to a JAR file.
Default
None.
The src attribute is a URL to a file containing
data that is played through the plugin. For most uses of the
embed element, this attribute is required, but
there are some circumstances in which it may not be necessary (see
the type attribute). Browsers typically use the
filename extension to determine which plugin to load (based on
browser preferences settings for plugins and helper applications).
Example
<embed name="babyClip" src="Ugachaka.avi" height="150" width="250"></embed>
Value
A complete or relative URL.
Default
None.
Object Model Reference
[window.]document.embeds[i].src
[window.]document.getElementById(elementID).src
Navigator anticipated the potential of a plugin not requiring any
outside data file. Instead, such a plugin would more closely resemble
an applet. If such a plugin is to be put into your document, you
still use the embed element but specify just the
MIME type instead of the data file URL (in the src
attribute). This assumes, of course, that the MIME type is of such a
special nature that only one possible plugin would be mapped to that
MIME type in the browser settings. Either the src
or type attribute must be present in a Navigator
embed element tag.
Example
<embed src="hooha.fbz" type="application/x-frobnitz" height="150" width="250"></embed>
Value
Any valid MIME type name as a quoted string, including the type and
subtype portions delimited by a forward slash. A catalog of
registered MIME types is available from ftp://ftp.isi.edu/in-notes/iana/assignments/media-types/.
Default
None.
units="measurementUnitType" | Optional | The units attribute is supposed to dictate the
kind of measurement units used for the element's
height and width attribute
values. Both Navigator 4 and Internet Explorer appear to treat the
measurements in pixels, regardless of this
attribute's setting.
Example
<embed src="jazz.aif" height="150" width="250" units="en"></embed>
Value
Not only does this attribute not appear to influence the rendering of
an embed element, but Navigator 4 and Internet
Explorer 4 disagree on the precise spelling and available units for
values. Navigator 4 specifies choices of pixels or
en; Internet Explorer goes with
px or em.
Default
pixels (or px).
Object Model Reference
[window.]document.embeds[i].units
[window.]document.getElementById(elementID).units
See height.
<fieldset> | NN 6 IE 4 HTML 4 |
<fieldset>...</fieldset> | HTML End Tag: Required | A fieldset element is a structural container for
form elements (as distinguished from the functional containment of
the form element). In fact, you can define
multiple fieldset elements within a single
form element to supply context to logical
groupings of form elements. For example, one
fieldset element might contain text input fields
for name and address info; another fieldset might
be dedicated to credit card information.
Supporting browsers boost the attractiveness of this element by
automatically drawing a rule around the form elements within each
fieldset container. You can also attach a label
that gets embedded within the rule by defining a
legend element immediately after the start tag of
a fieldset element. By default, the box extends
the full width of the next outermost container
geography—usually the document body or
html element. If you'd rather
have the box cinch up around the visible form elements, you have to
set the width style sheet property for the
element.
Example
<form method="POST" action="...">
<fieldset>
<legend>Credit Card Information</legend>
...inputElementsHere...
</fieldset>
</form>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
Element-Specific Event Handler Attributes
None.
align | NN n/a IE 4 HTML n/a |
The align attribute appears only in Internet
Explorer, and its implementation is far from consistent across
operating systems. In theory, the attribute should control the
alignment of input elements it contains. This is
true in the Macintosh version of IE, but in the Windows version
(especially in IE 6), the settings have minor effect on the
fieldset element rule. It is best to let the
default setting take precedence, and override with style sheets.
Example
<fieldset align="right">...</fieldset>
Value
Allowed values are left |
center | right.
Default
left
Object Model Reference
[window.]document.getElementById(elementID).align
<font> | NN all IE all HTML 3.2 |
<font>...</font> | HTML End Tag: Required | A font element is a container whose contents are
rendered with the font characteristics defined by the
element's attributes. This element is deprecated in
HTML 4 in favor of font attributes available in style sheets that are
applied directly to other elements or the arbitrary
span container for inline font changes. This
element will be supported for a long time to come to allow backward
compatibility with web pages designed for older browsers, however.
For nested tables in Navigator 4, style sheet inheritance frequently
breaks down. Inserting font wrappers around
content inside a td element can fortify your
control over the design. Going forward, use font
elements only as a last resort if a browser version balks at obeying
CSS font rules.
The font element evolved over its lifetime, adding
new attributes along the way to work in the more mature browsers.
Navigator included some proprietary attributes for Version 4 (only)
that are better served by style sheets for cross-browser
compatibility.
Example
<font face="Times, serif" size="4">
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
color
|
face
|
point-size
|
size
|
weight
|
Element-Specific Event Handler Attributes
None.
color="colorTripletOrName" | Optional | Sets the font color of all text contained by the
font element. This attribute is deprecated in HTML
4 in favor of style sheets.
Example
<font color="Olive">...</font>
Value
A hexadecimal triplet or plain-language color name. See Appendix A for acceptable plain-language color names.
Default
Browser default.
Object Model Reference
[window.]document.getElementById(elementID).color
face="fontFamilyName1[, ...
fontFamilyNameN]" You can assign a hierarchy of font families to use for a segment of
text contained by a font element. The browser
looks for the first font family in the comma-delimited list of font
family names until it either finds a match on the client system or
runs out of choices, at which point the browser default font family
is used. Font family names must match the system font family names
exactly. If you use this attribute (instead of the preferred
font-family style sheet attribute), you can always
suggest a generic font face (serif,
sans-serif) as the final choice.
Example
<font face="Bookman, Times Roman, serif">...</font>
Value
One or more font family names, including the recognized generic
faces: serif | sans-serif |
cursive | fantasy |
monospace.
Default
Browser default.
Object Model Reference
[window.]document.getElementById(elementID).face
point-size | NN |4| IE n/a HTML n/a |
point-size="pointSize" | Optional | The point-size attribute is Navigator
4's nonCSS equivalent of setting the font size by
specific point size (rather than by relative font size directed by
the size attribute). If you assign a value to the
point-size attribute and set the
font-size style attribute, the style attribute
takes precedence. If you are aiming for cross-browser deployment, I
suggest using style sheets exclusively for precise point or pixel
sizes.
Example
<font point-size="14">...</font>
Value
A positive integer, representing the desired point size.
Default
Browser default.
size | NN all IE all HTML 3.2 |
size="integerOrRelativeSize" | Optional | Font sizes referenced by the size attribute are
the relative size scale that is not tied to any one point size across
operating system platforms. The default browser font size is 3. The
range of acceptable values for the size attribute
are integers from 1 to 7 inclusive. The exact point size varies with
the operating system and browser design.
Users can often adjust the default font size in preferences settings.
The size attribute overrides that setting.
Moreover, size values can be relative to whatever
font size is set in the preferences. By preceding an attribute value
with a + or - sign, the browser's
default size can be adjusted upward or downward, but always within
the range of 1 through 7.
Example
<font size="4">...</font>
<font size="+3">...</font>
Value
Either an integer (quoted or not quoted) or a quoted relative value
consisting of a + or - symbol and an integer
value.
Default
3
Object Model Reference
[window.]document.getElementById(elementID).size
weight | NN |4 | IE n/a HTML n/a |
weight="boldnessValue" | Optional | The weight attribute is Navigator
4's nonCSS equivalent of setting the font weight
with a regular attribute rather than by style sheet rule. The
attribute is unreliable, so the font-weight CSS
style attribute is a better choice.
Value
Integer value between 100 and 900 in increments of 100. A value of
900 is the maximum boldness setting.
Default
Unknown.
<form> | NN all IE all HTML all |
<form>...</form> | HTML End Tag: Required | Despite the importance of HTML forms in communication between web
page visitors and the server, a form element at
its heart is nothing more than a container of controls. Most, but not
all, form controls are created in the document as
input elements. Even if user interaction with
input elements is not intended for submission to a
server (perhaps some client-side scripting requires interaction with
the user), such input elements are contained by a
form element—and must be nested inside a
form element to render at all in Navigator 4 or
earlier.
A document may contain any number of form
elements, but a client may submit the settings of controls from only
one form at a time. Therefore, the only time it makes sense to divide
a series of form controls into multiple form
elements is when the control groups can be submitted independently of
each other. If you need to logically or structurally group controls
while maintaining a single form, use the fieldset
element to create the necessary subgroupings of controls.
When a form is submitted to the server, all controls that have
name attributes assigned to them pass both their
names and values—in name/value pairs—to the server for
further processing (or possibly as an email attachment or message
with the help of a browser's e-mail module). A
Common Gateway Interface (CGI) program running on the server can
accept and dissect the name/value pairs for further processing
(adding a record to a server database or initiating a keyword search,
for example). The server program is invoked via URL to the program
assigned to the action attribute.
Inside browsers, the submission process consists of a few
well-defined steps. The process begins with the browser assembling a
form data set out of the name/value pairs of form controls. The name
comes from the value assigned to the name
attribute. A control's value depends on the type of
control. For example, a text input element's value
is the content appearing in the text box at submission time; for a
radio button within a radio group (all of whose
name attributes are assigned the same value), the
value assigned to the value attribute of the
selected radio button is inserted into the name/value pair for the
radio group.
The W3C recommendations prefer that form controls use their
id attributes in name/value pairs. As of Version 6
browsers, however, only the name attribute is
recognized as an identifier for the submitted name/value pair.
The second step of submission encodes the text of each name/value
pair. A + symbol is substituted for each space
character. Reserved characters (as defined by RFC 1738) are escaped,
and all other nonalphanumeric characters are converted to hexadecimal
representations (in the form
%HH, where
HH is the hex code for the ASCII value of
the character). Name and value components of each name/value pair are
separated by an = symbol, and each name/value pair
is delimited with an ampersand (&).
In the final step, the method attribute setting
determines how the escaped form data set is transmitted to the
server. With a method of get,
the form data set is appended to the URL stated in the
action attribute, separated by a
? symbol. With a method of
post and a default enctype, the
data set is transmitted as a kind of (non-email) message to the
server. Data submitted via the GET method is
limited in character length, while the POST method
offers unlimited data length and no echoed display in the
browser's Address box.
Default behavior of the Enter key in
forms has evolved into a recognized standard. When a form consists of
a single text input element, pressing the
Enter (or Return) key automatically submits the form (as
if the user had clicked on a submit button
element. If the form consists of two or more text
input elements, the Enter
(or Return) key does not
automatically submit the form (with the exception of IE/Mac).
Form submission can be canceled in modern browsers with the help of
scripts that perform validation checking or other functions triggered
by the onsubmit event handler. This event fires
prior to the form being submitted. If the event handler evaluates to
return false, the form is not submitted, and the
user may continue to edit the form elements.
Example
<form name="orders" method="POST" action="http://www.giantco.com/cgi-bin/order">
...
</form>
Object Model Reference
[window.]document.forms[i]
[window.]document.forms[formName]
[window.]document.formName
[window.]document.getElementById(elementID)
Element-Specific Attributes
accept
|
accept-charset
|
acceptcharset
|
action
|
autocomplete
|
enctype
|
method
|
name
|
target
|
|
Element-Specific Event Handler Attributes
Handler
|
NN
|
IE
|
HTML
|
onreset
|
3
|
4
|
4
|
onsubmit
|
2
|
3
|
4
|
accept | NN n/a IE n/a HTML 4 |
accept="MIMETypeList" | Optional | Intended for use with input elements of type
file, the accept attribute lets
you specify one or more MIME types for allowable files to be uploaded
to the server when the form is submitted. The predicted
implementation of this attribute would filter the file types listed
in file dialogs used to select files for uploading. In a way, this
attribute provides client-side validation of a file type so that
files not conforming to the permitted MIME type are not even sent to
the server.
Example
<form accept="text/html, image/gif" ...>...</form>
Value
Case-insensitive MIME type (content type) value. For multiple items,
a comma-delimited list is allowed. A catalog of registered MIME types
is available from ftp://ftp.isi.edu/in-notes/iana/assignments/media-types/.
Default
None.
accept-charset, acceptcharset | NN 6 IE 5 HTML 4 |
accept-charset="MIMETypeList" | Optional | A server advisory (for servers that are equipped to interpret the
information) about which character sets it must receive from a client
form. The hyphenated version is from the HTML 4 specification, but IE
5 and later/Windows and Netscape 6 implement the attribute name
without the hyphen.
Example
<form accept-charset="it, es" ...>...</form>
Value
Case-insensitive alias from the character set registry (ftp://ftp.isi.edu/in-notes/iana/assignments/character-sets).
Multiple character sets may be delimited by commas. The reserved
value, unknown, is supposed to represent the
character set that the server used to generate the form for the
client.
Default
unknown
action | NN all IE all HTML all |
Specifies the URL to be accessed when the form is being submitted.
When the form is submitted to a server for further processing, the
URL may be to a CGI program or to an HTML page that includes
server-side scripts. (Those scripts execute on the server before the
HTML page is downloaded to the client.) As a result of the
submission, the server returns an HTML page for display in the
client. If the returned display is to be delivered to a different
frame or window, the target attribute must be
specified accordingly.
You may also substitute a mailto: URL for the
action attribute value. Navigator turns the
name/value pairs of the form into a document for attachment to an
email message (or as the message body with the
enctype attribute set to
"text/plain" and the enctype
attribute precedes the action attribute). For
privacy reasons, client users are notified of the impending email
transmission and have the chance to cancel the message.
Form-mailing capabilities are essentially disabled in Netscape 6 and
7. Implementations across all browsers are very uneven—you may
be missing form submissions from many users. If CGI processing of
forms is beyond your expertise, search for third-party FormMail
services that forward forms to you via email.
If you omit the action attribute and the form is
submitted, the current page reloads itself, returning all form
elements to their default values.
Example
<form method="POST" action="http://www.giantco.com/orders/order.html">
Value
A complete or relative URL.
Default
None.
Object Model Reference
[window.]document.forms[i].action
[window.]document.forms[formName].action
[window.]document.formName.action
[window.]document.getElementById(elementID).action
autocomplete | NN n/a IE 5 HTML n/a |
autocomplete="featureSwitch" | Optional | If an IE user has automatic form completion preference enabled, the
autocomplete attribute governs the feature for the
entire form. You must also specify vcard-name
attributes for text and password type input
elements to let the browser pre-fill or assist the entry of a
particular named field that matches one of the preferences entries.
Example
<form method="POST" action="register.pl" autocomplete="on">
Value
Constants: on | off.
Default
off
Object Model Reference
[window.]document.forms[i].autoComplete
[window.]document.forms[formName].autoComplete
[window.]document.formName.autoComplete
[window.]document.getElementById(elementID).autoComplete
enctype | NN all IE all HTML all |
enctype="MIMEType" | Optional | Sets a MIME type for the data being submitted to the server with the
form. For typical form submissions (where the
method attribute is set to
POST), the default value is the proper content
type. If you include a file input element, specify
"multipart/form-data" as the
enctype attribute.
Example
<form method="POST" enctype="text/plain" action="mailto:orders@giantco.com">
...
</form>
Value
MIME type (content type) value. For multiple items, a comma-delimited
list is allowed.
Default
application/x-www-form-urlencoded
Object Model Reference
[window.]document.forms[i].encoding
[window.]document.forms[formName].encoding
[window.]document.formName.encoding
[window.]document.getElementById(elementID).encoding
method | NN all IE all HTML all |
method="GET" | "POST" | Optional | Forms may be submitted via two possible HTTP methods:
GET and POST. These methods
determine whether the form element data is sent to the server
appended to the action attribute URL
(GET) or as a transaction message body
(POST). In practice, when the
action and method attributes
are not assigned in a form element, the form
performs an unconditional reload of the same document, restoring form
controls to their default values.
Example
<form method="POST" action="http://www@giantco.com/orders/order.html">
...
</form>
Value
Constant values of GET or POST.
Browsers respond to upper- or lowercase values.
Default
GET
Object Model Reference
[window.]document.forms[i].method
[window.]document.forms[formName].method
[window.]document.formName.method
[window.]document.getElementById(elementID).method
name="elementIdentifier" | Optional | Assigns an identifier to the entire form element.
This value is particularly useful in writing scripts for older
browsers that reference the form or its nested controls. Newer
browsers support the preferred id attribute for
this purpose, but the name attribute is still
needed for form submission.
Example
<form name="orders" id="orders" method="POST"
action="http://www.giantco.com/cgi-bin/order">
...
</form>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.forms[i].name
[window.]document.forms[formName].name
[window.]document.formName.name
[window.]document.getElementById(elementID).name
target | NN all IE all HTML all |
target="windowOrFrameName" | Optional | If the HTML document returned from the server after it processes the
form submission is to be loaded into a window or frame other than the
current window or frame, you can specify where the returned document
should load by assigning a window or frame name to the
target attribute. Target frame names must be
assigned to frames and windows as identifiers. Assign names to frames
via the name attribute of the
frame element; assign names to new windows via the
second parameter of the window.open( ) scripting
method. If you omit this attribute, the returned document replaces
the document containing the form element. An
identifier other than one belonging to an existing frame or window
opens a new window for the returned document.
If the form is located in a subwindow, and you want the target to be
the main window, you must first use a script to assign an identifier
to the name property of the main window. Use that
name as the value of the form's
target attribute.
Strict DTDs for HTML 4 and XHTML do not support the
target attribute of any element because frames and
windows are outside the scope of pure document markup. In fact,
framesetting documents will not validate in the strict
environment—thus the purpose of the separate frameset DTDs for
HTML 4 and XHTML. If your documents must validate with these strict
DTDs, and you wish to support targets, use scripts to set
target properties of links, image maps, and forms
after the page has loaded.
A form element can have only one returned document
and one target. If you want a form submission to change the content
of multiple frames, you can include a script in the returned document
whose onload event handler loads or dynamically
writes a document into a different frame. (Set the
location.href property of each frame to a desired
URL.)
Example
<form method="POST" action="http://www.giantco.com/cgi-bin/order" target="new">
...
</form>
Value
Case-sensitive identifier when the frame or window name has been
assigned via the target element's
name attribute. Four reserved target names act as
constants:
- _blank
-
Browser creates a new window for the destination document.
- _parent
-
Destination document replaces the current frame's
framesetting document (if one exists; otherwise, it is treated as
_self).
- _self
-
Destination document replaces the current document in its window or
frame.
- _top
-
Destination document is to occupy the entire browser window,
replacing any and all framesets that may be loaded (also treated as
_self if there are no framesets defined in the
window).
Default
_self
Object Model Reference
[window.]document.forms[i].target
[window.]document.forms[formName].target
[window.]document.formName.target
[window.]document.getElementById(elementID).target
<frame> | HTML End Tag: Forbidden | The frame element defines properties of an
individual window space that is some fractional portion of the entire
browser window. A frame element must be defined
within the context of a frameset element. It is
the frameset that defines the row and column
arrangement of a related group of frames.
A browser treats a frame as a separate browser window within the
browser application's window. As such, each frame
window can load its own content, independent of other frames.
Although no attributes of the frame element are
required, assigning a value to the name attribute
is highly recommended if you have forms or links whose returned or
destination document is to be displayed in a different frame.
Scripting among multiple frames also benefits greatly from names
assigned to frames because it makes references to those frames (and
their contents) more easily understandable to someone reading the
script code. Note that among recent W3C DTDs, the
frame element validates only in the HTML 4.01
Transitional DTD and the Frameset DTDs for both HTML 4.01 and XHTML
1.0. See Appendix E.
Example
<frameset cols="150,*">
<frame name="navbar" src="nav.html">
<frame name="main" src="page1.html">
</frameset>
Object Model Reference
[window.]frameName
[window.]frames[i]
[window.]document.getElementById(elementID)
Element-Specific Attributes
allowtransparency
|
bordercolor
|
datafld
|
datasrc
|
frameborder
|
height
|
longdesc
|
marginheight
|
marginwidth
|
name
|
noresize
|
scrolling
|
security
|
src
|
width
|
|
Element-Specific Event Handler Attributes
None.
allowtransparency | NN n/a IE 5.5 HTML n/a |
allowtransparency="featureSwitch" | Optional | More applicable to the iframe element, the
allowtransparency attribute, when engaged, turns
the frame's background transparent. See the
iframe element.
bordercolor | NN 3 IE 4 HTML n/a |
bordercolor="colorTripletOrName" | Optional | If your frameset displays borders (as set with the
border attribute of the
frameset element), but you want a subset of the
frames in the frameset to be rendered with a border color different
from the rest, you can assign a color to the
bordercolor attribute of an individual
frame element. Mixing border colors in a frameset
exposes your HTML to the risk of different rendering techniques of
each browser and operating system. Not only do the precise pixel
composition of borders vary, but each browser and operating system
may resolve conflicts between colored borders differently. If you
assign a color to only some frames of a frameset, be sure to test the
look on as many browser versions and operating systems as possible to
evaluate the visual effect of your color choices. IE 6 for Windows
ignores this attribute.
Example
<frame name="navbar" src="nav.html" bordercolor="salmon">
Value
A hexadecimal triplet or plain-language color name. See Appendix A for acceptable plain-language color names.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).borderColor
datafld | NN n/a IE 4 HTML n/a |
datafld="columnName" | Optional | Used with IE data binding to associate a remote data source column
name in lieu of an src attribute for a
frame element. The data source column must contain
a valid URI (relative or absolute). A datasrc
attribute must also be set for the element. Works only with text file
data sources in IE 5/Mac.
Example
<frame datasrc="DBSRC3" datafld="newsURL">
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).dataFld
datasrc | NN n/a IE 4 HTML n/a |
datasrc="dataSourceName" | Optional | Used with IE data binding to specify the ID of the
page's object element that loads
the data source object for remote data access. Content from the data
source is specified via the datafld attribute.
Works only with text file data sources in IE 5/Mac.
Example
<frame datasrc="DBSRC3" datafld="newsURL">
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).dataSrc
frameborder | NN 3 IE 3 HTML 4 |
frameborder="borderSwitch" | Optional | Controls whether an individual frame within a frameset displays a
border. The setting is supposed to override the
frameborder attribute setting of the containing
frameset element. Controlling individual frame
borders appears to be a problem for most browsers in most operating
system versions. Turning off the border of one frame may have no
effect if all adjacent frames have their borders on. Feel free to
experiment with the effects of turning some borders on and some
borders off, but be sure to test the final effect on all browsers and
operating systems used by your audience. You can rely more
comfortably on the frameborder attribute of the
entire frameset.
Example
<frame name="navbar" src="nav.html" frameborder="0">
Value
On-off values for this attribute vary with the source. HTML 4
specifies the values of 1 (on) and
0 (off). Navigator 3 and 4 use
yes and no. Internet Explorer 4
and later and Netscape 6 accept both sets of values.
Default
1
Object Model Reference
[window.]document.getElementById(elementID).frameBorder
height, width | NN n/a IE 4 HTML n/a |
height="length"
width="length" Microsoft HTML documentation for IE says that the
height and width attributes
control the size of a frame. In practice in IE, these attributes have
no direct control over the appearance of the frames within a
frameset. Instead, the cols and
rows attributes of the containing
frameset govern the initial geometry of a frame.
Do not use these attributes.
Specifies a URL of a document that contains a longer description of
the element than what the content of the title
attribute reveals. One application of this attribute in future
browsers is to retrieve an annotated description of the element for
users who cannot read the browser screen. The Properties choice for Netscape
6's context menu for this element displays a small
window that includes an active link to the URL assigned to the
attribute. Version 6 browsers provide no other functionality for this
attribute.
Example
<frame longdesc="navDesc.html" title="Navigation Bar" src="navbar.html">
Value
Any valid URI, including complete and relative URLs.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).longDesc
marginheight, marginwidth | NN 6 IE 3 HTML 4 |
marginheight="pixelCount"
marginwidth="pixelCount" The number of pixels between the inner edge of a frame and the
content rendered inside the frame. The
marginheight attribute controls space along the
top and (when scrolled) the bottom edges of a frame; the
marginwidth attribute controls space on the left
and right edges of a frame. The HTML 4 specification leaves default
behavior up to browsers.
Without any prompting, Internet Explorer automatically inserts a
margin of 14 (Windows) or 8 (Macintosh) pixels inside a frame. But if
you attempt to override the default behavior, be aware that setting
any one of these two attributes causes the value of the other to go
to zero. Therefore, unless you want the content to be absolutely
flush with various frame edges, you need to assign values to both
attributes.
Example
<frame src="navbar.html" marginheight="20" marginwidth="14">
Value
Any positive integer value or zero.
Default
14 (IE/Windows) or 8
(IE/Macintosh).
Object Model Reference
[window.]document.getElementById(elementID).marginHeight
[window.]document.getElementById(elementID).marginWidth
name="elementIdentifier" | Optional | When links and forms must load their destination or returned
documents into frames other than the one holding the link or form,
those elements have target attributes indicating
which frame receives the new content. To direct such content to a
frame, the frame must have a value assigned to its
name attribute. That same value is assigned to the
target attribute of the a or
form element. Client-side scripting also uses the
frame's name in building references to other frames
or content in other frames. It is good practice to assign a unique
identifying name to all frames.
The name attribute is deprecated in XHTML. To validate under the
Frameset XHTML DTD, assign the same identifier to the
element's name and
id attributes.
Example
<frame name="navbar" id="navbar" src="nav.html">
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]frameName.name
[window.]frames[i].name
[window.]document.getElementById(elementID).name
Frame borders can be resized by the user dragging the border
perpendicular to the axis of the border edge. When present, the
noresize attribute instructs the browser to
prevent the frame's edges from being manually
resized by the user. All border edges of the affected
frame element become locked, meaning that all
edges that extend to other frames in the frameset remain locked as
well.
Example
<frame src="navbar.html" noresize>
Value
The presence of the attribute in HTML makes the frame nonresizable.
Default
Frames are resizable by default.
Object Model Reference
[window.]document.getElementById(elementID).noResize
scrolling | NN 2 IE 3 HTML 4 |
scrolling="auto" | "no" | "yes" | Optional | By default, browsers add vertical and/or horizontal scrollbars when
the content loaded into a frame exceeds the visible content region of
the frame. Scrollbars can affect the layout of some content because
they occupy space normally devoted to content (that is, the frame
does not expand to accommodate scrollbars). Also, due to differences
in default font sizes in browsers and operating system versions, a
given collection of text content may display differently in different
clients. If you want to prevent scrollbars from appearing in the
frame, set the scrolling attribute to
no; if you want scrollbars to be in the frame at
all times, set the attribute to yes. In the latter
case, if the content does not require scrolling, the scrollbars are
disabled. In some older versions of Navigator, the automatic
scrollbars remain visible, even if content not requiring them is
subsequently loaded into a frame. In Navigator 4 and later and all
versions of Internet Explorer, the automatic scrollbars appear only
when needed.
Setting the scrolling attribute to
no should be used only after you have tested on
all browsers and platforms that mission-critical content is always
visible in the frame. If the frame is set to not scroll and has the
noresize attribute set, some users might not be
able to see all the content of the frame.
Example
<frame src="navbar.html" scrolling="no">
Value
Constant values: auto | no |
yes.
Default
auto
Object Model Reference
[window.]document.getElementById(elementID).scrolling
security | NN n/a IE 6 HTML n/a |
security="restricted" | Optional | When activated, this attribute raises the security level of the frame
to the Restricted level of the Windows Security preferences settings.
Such a frame's content may not execute scripts.
Example
<frame src="navbar.html" security="restricted">
Value
Constant value: restricted.
Default
None.
Defines the URL of the content to be loaded into the
frame element. The URL can be an absolute URL or
one relative to the URL of the document containing the frameset
specifications. You may also use the javascript:
pseudo-URL to have the returned value of a script appear in the
frame. For example, if you want a frame to be blank when the frameset
loads, you can define a function in the frameset document that
returns a blank HTML page. The src attribute for
each soon-to-be blank frame invokes the function from the vantage
point of the child frame:
<html>
<script language="JavaScript">
function blank( ) {
return "<html></html>"
}
</script>
<frameset cols="50%,50%">
<frame name="leftFrame" src="javascript:parent.blank( )">
<frame name="rightFrame" src="javascript:parent.blank( )">
</frameset>
</html>
Another type of blank page is available from some browsers and
versions via the about:blank URL, which draws from
an internal blank page. However, Navigator 2 and 3 for the Macintosh
display an unwanted message with this URL in a window or frame.
Example
<frame src="navbar.html">
Value
A complete or relative URL or a javascript:
pseudo-URL.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).src
See height.
<frameset> | NN 2 IE 3 HTML 4 |
<frameset>...</frameset> | HTML End Tag: Required | Defines the layout of a multiple-frame presentation in a
browser's application window. The primary duty of
the frameset element is to specify the
geographical layout—in a row and column array—of
rectangular frames. Attributes defined in a
frameset element apply to all
frame elements nested within (unless overridden by
a similar attribute for a specific frame). A
frameset element's tag takes the
place in an HTML document that is normally devoted to the
body element.
You may nest a frameset element within a
frameset element. This tactic allows you to
subdivide a frame from the outer frameset element
into two or more frames. For example, if you define one
frameset element with three rows and two columns,
you get a total of six frames:
<frameset rows="33%, 33%, 34%" cols="50%, 50%">
<frame name="r1c1" id="r1c1"...>
<frame name="r1c2" id="r1c2"...>
<frame name="r2c1" id="r2c1"...>
<frame name="r2c2" id="r2c2"...>
<frame name="r3c1" id="r3c1"...>
<frame name="r3c2" id="r3c2"...>
</frameset>
Figure 8-1 shows the resulting frame organization. Figure 8-1. A three-row, two-column framesetOn the other hand, if you nest a frameset where a frame definition
goes, that frame is divided into whatever frame organization is
defined by that nested frameset. Consider the following nested
frameset:
<frameset rows="33%, 33%, 34%">
<frame name="r1" id="r1"...>
<frameset cols="50%, 50%">
<frame name="r2c1" id="r2c1"...>
<frame name="r2c2" id="r2c2"...>
</frameset>
<frame name="r3" id="r3"...>
</frameset>
This produces the frame organization shown in Figure 8-2. Figure 8-2. A nested framesetYou may nest frameset elements as deeply as your
page design requires. Be aware that frames can devour memory
resources of browsers on some operating systems. Not all users
appreciate frames that display borders, even when such a structure
may make logical sense for your page design.
The outermost frameset document is the one whose
title attribute governs the display in the browser
window title bar. Documents loaded into individual frames have no
control over title bar display, although for reasons of scripting and
potential application in future browsers, the
title attribute of framed documents should be set
anyway.
If you wish to offer an option for a user to remove a frameset, you
can supply a link or button that invokes a script. The script should
set the top.location.href property to the URL of
the single most important document of the pages loaded into frames
(the primary content).
Strict DTDs for HTML 4 and XHTML explicitly exclude support for
frameset and frame elements
(and target attributes of other elements that
point to frames). These document type definitions treat frames as
outside the scope of pure document markup. You can validate a
framesetting document with the HTML 4 transitional and frameset DTDs
or the XHTML frameset DTD.
Example
<frameset cols="150,*">
<frame name="navbar" id="navbar" src="nav.html">
<frame name="main" id="main" src="page1.html">
</frameset>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
border
|
bordercolor
|
cols
|
frameborder
|
framespacing
|
rows
|
Element-Specific Event Handler Attributes
Handler
|
NN
|
IE
|
HTML
|
onload
|
2
|
3
|
4
|
onunload
|
2
|
3
|
4
|
border="pixelCount" | Optional | Frames display 3-D borders by default. The default thickness of that
border varies with browser and operating system. You can adjust this
thickness by assigning a different value to the
border attribute of the frameset. Only the
outermost frameset element of a system of nested
framesets responds to the border attribute
setting. Note that this attribute controls inter-frame borders, and
not a border around the frameset.
Navigator 4 is consistent across Windows and Macintosh platforms by
displaying a default border that is the same thickness as when the
border attribute is set to 5. For IE, the default
value is 6 in Windows and 1 on the Mac (although the actual rendering
is far more than one pixel wide). Any single setting you make for the
border attribute therefore does not look the same
on all browsers. Moreover, at smaller settings, some browsers react
strangely. IE 6 won't display a border in Windows
when the value is 4 or less; Navigator loses its 3-D effect when the
value is 2 or less. Navigator 4 also has a nasty habit of rendering
an odd divot in the center of frame bars on the Macintosh.
This hodge-podge deployment of frame borders may make you shy away
from using them altogether (set the border
attribute to 0). In some cases, however, borders
provide reassuring visual contexts for frame content that requires a
scrollbar. Having a scrollbar appear floating in a browser window
might be disconcerting to some viewers.
That the HTML 4 specification does not include a
border attribute might lead one to believe it
prefers the use of style sheet borders instead of borders tied only
to frames. At most, however, a border-related CSS style attribute
affects only a border around the entire frameset, and has no impact
on borders between frames.
Example
<frameset cols="150,*" border="0">...</frameset>
Value
An integer value. A setting of zero eliminates the border entirely.
Although the value is supposed to represent the precise pixel
thickness of borders in the frameset, this is not entirely true for
all operating systems or browsers.
Default
See description.
Object Model Reference
[window.]document.getElementById(elementID).border
bordercolor | NN 3 IE 4 HTML n/a |
bordercolor="colorTripletOrName" | Optional | Establishes the rendering color for all visible borders in a
frameset. A bordercolor setting in an outermost
frameset element may be overridden by a
bordercolor attribute of a nested
frameset element (for the nested
frameset's frames only) or an individual
frame element. Browsers resolve conflicts of
colors assigned to adjacent frames differently. Test your color
combinations carefully if you mix border colors.
Example
<frameset cols="150,*" bordercolor="salmon">...</frameset>
Value
A hexadecimal triplet or plain-language color name. See Appendix A for acceptable plain-language color names.
Default
Browser default, usually a shade of gray with black or blue
highlighting for the 3-D effect.
Object Model Reference
[window.]document.getElementById(elementID).borderColor
cols="columnLengthsList" | Optional | Defines the sizes or proportions of the column arrangement of frames
in a frameset. If you intend to use the frameset
element to create frames in multiple columns, you must assign a list
of values to the cols attribute, with one value
per column.
Column size is defined in one of three ways: Use an absolute pixel size when you want the width of a frame to be
the same no matter how the user has sized the overall browser window.
This is especially useful when the frame is to display an object of
fixed width, such as an image. Use a percentage when you want the
frame width to be a certain proportion of the
frameset's width, no matter how the user has
adjusted the size of the overall browser window. If you use all
percentage values for the cols attribute, they
should add up to 100%. If the values don't add up to
100%, the browser makes the columns fit anyway. Finally, use the
asterisk wildcard value to let the browser calculate the width of one
frame when all other frames in the frameset have fixed or percentage
values assigned to them. Separate the values within the attribute
value string with commas.
You can mix and match all three types of values in the attribute
string. For example, consider a three-column frameset. If you want
the leftmost column to be exactly 150 pixels wide, but the middle
column must be 50% of the total frameset width, set the value as
follows:
<frameset cols="150,50%,*">
The precise width of the two rightmost frames is different with each
browser window's width adjustment. The rightmost
frame width in this example is roughly equal to one half the width of
the frameset minus the 150 pixels reserved for the leftmost frame.
You may define an invisible column to the right. Use percentage
values for visible columns, and make sure they total 100%. Then
assign the asterisk value for the final column.
To create a regular grid of frames, assign values to both the
cols and rows attributes in the
frameset element's tag. For an
irregular array, you must nest frameset elements,
as shown in the description of the frameset
element, earlier in this section.
Example
<frameset cols="25%,50%,25%">...</frameset>
Value
Comma-separated list of pixel, percentage, or wildcard
(*) values. Internet Explorer 4 for the Macintosh
exhibits incorrect behavior with some combinations that include a
wildcard value.
Default
100%
Object Model Reference
[window.]document.getElementById(elementID).cols
frameborder | NN 3 IE 3 HTML n/a |
frameborder="borderSwitch" | Optional | Controls whether all frames within the frameset display a border
(acting as dividers between frame edges). The
frameborder attribute of frame
elements can override the frameset
element's setting for this attribute, but some frame
organizations don't lend themselves well to
eliminating frames from subgroups of frames. Override the
frameset element's attribute with
caution, and test on all browsers and operating system platforms.
Example
<frameset cols="25%,50%,25%" frameborder="no">...</frameset>
Value
On-off values for this attribute vary with the browser. Navigator
uses yes and no. Internet
Explorer 4 and later accepts both yes |
no and 1 |
0. For cross-browser compatibility, use the
yes/no pairing.
Default
yes
Object Model Reference
[window.]document.getElementById(elementID).frameBorder
framespacing | NN n/a IE 3 HTML n/a |
framespacing="pixelLength" | Optional | The Internet Explorer framespacing attribute is an
older version of the border attribute. The older
attribute is supported in current IE versions for backward
compatibility. The behavior of the framespacing
attribute is more uniform across operating system versions of IE: a
setting of 10 pixels generates a border between frames that is
essentially identical in both Windows and Mac versions. For an
IE-only deployment, the framespacing attribute is
a more accurate way to create borders that look the same across
operating system versions.
Example
<frameset cols="25%,50%,25%" framespacing="7">...</frameset>
Value
A positive integer. Unlike the border attribute,
however, a setting of zero does not remove the border. Use the
frameborder attribute to hide borders entirely.
Default
2
Object Model Reference
[window.]document.getElementById(elementID).frameSpacing
rows="rowLengthsList" | Optional | Defines the sizes or proportions of the row arrangement of frames in
a frameset. If it is the intent to use the
frameset element to create frames with multiple
rows, you must assign a list of values to the rows
attribute, with one value per row.
Row size is defined in one of three ways: -
An absolute pixel size
-
A percentage of the height available for the entire frameset in the
browser window
-
A wildcard (*) to represent all available
remaining space in the browser window after other pixels and
percentages have been accounted for
Use an absolute pixel size when you want the height of a frame row to
be the same no matter how the user has sized the overall browser
window. This is especially useful when the frame is to display an
object of fixed height, such as an image. Use a percentage when you
want the frame height to be a certain proportion of the
frameset's height, no matter how the user has
adjusted the size of the overall browser window. If you use all
percentage values for the rows attribute, they
should add up to 100%. If the values don't add up to
100%, the browser makes the rows fit anyway. Finally, use the
asterisk wildcard value to let the browser calculate the height of
one row when all other rows in the frameset have fixed or percentage
values assigned to them. Separate the values within the attribute
value string with commas.
You can mix and match all three types of values in the attribute
string. For example, consider a three-row frameset. If you want the
bottom row to be exactly 80 pixels high to accommodate a navigation
bar, but the middle row must be 50% of the total frameset height, set
the value as follows:
<frameset rows="*,50%,80">
The precise height of the two topmost frames is different with each
browser window's height adjustment. The topmost
frame height in this example is roughly equal to one half the height
of the frameset minus the 80 pixels reserved for the bottom row.
You may define an invisible row at the bottom. Use percentage values
for visible rows, and make sure they total 100%. Then assign the
asterisk value for the final row.
To create a regular grid of frames, assign values to both the
cols and rows attributes in the
frameset element's tag. For an
irregular array, you must nest frameset elements,
as shown in the description of the frameset
element, earlier in this section.
Example
<frameset rows="25%,50%,25%">...</frameset>
Value
Comma-separated list of pixel, percentage, or wildcard
(*) values. Internet Explorer 4 for the Macintosh
exhibits incorrect behavior with some combinations that include a
wildcard value.
Default
100%
Object Model Reference
[window.]document.getElementById(elementID).rows
<h1>, <h2>, <h3>, <h4>, <h5>, <h6> | NN all IE all HTML all |
<h1>...</h1>, <h2>...</h2>, <h3>...</h3>
<h4>...</h4>, <h5>...</h5>, <h6>...</h6> HTML defines a series of six heading levels with associated numbers
that are intended to signify the relative importance of the section
below the heading. The h1 element represents the
most important, whereas h6 represents the least
important. HTML document parsers can examine a
page's tags to create a table of contents based on
the headings. This means that for proper document structure, these
heading levels should be used in sequence, without skipping levels
for aesthetic purposes.
It is up to the browsers to determine the default font, weight, and
other characteristics of each level. Each heading element is rendered
on its own line, with no line break or paragraph elements necessary
to begin the content of the section titled with the heading. Figure 8-3 shows examples of how Netscape 6 and
Internet Explorer 6 renders all six heading levels in Windows. By and
large, this pattern applies to other browser versions and operating
systems.
Figure 8-3. Heading levels in Internet Explorer 6 and Netscape 6You can always override the browser's rendering
style for any heading level or individual heading with style sheet
rules.
Example
<h1>The Solar System</h1>
<p>Floating gracefully within the Milky Way galaxy is our Solar System. ...</p>
<h2>The Sun</h2>
<p>At a distance of 93,000,000 miles from Earth, the Sun...</p>
<h3>The Planets</h3>
<p>Nine recognized planets revolve around the Sun. ...</p>
<h4>Mercury</h4>
...
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
Element-Specific Event Handler Attributes
None.
align | NN all IE all HTML 3.2 |
Determines how the element's text is aligned inside
the element's block. Both Navigator and Internet
Explorer support alignment values for center,
left, and right alignment.
Transitional HTML 4 (but not XHTML) adds the possibility of a fully
justified alignment for multilined content, as well.
The align attribute is deprecated in HTML 4 in
favor of the text-align: style sheet attribute.
Example
<h1 align="center">Article I</h1>
Value
The following table shows values for the align
attribute. Values may be treated as case-insensitive values.
Value
|
NN 4+
|
IE 4+
|
HTML4
|
center
|
•
|
•
|
•
|
justify
|
-
|
-
|
•
|
left
|
•
|
•
|
•
|
right
|
•
|
•
|
•
|
Default
left
Object Model Reference
[window.]document.getElementById(elementID).align
<head> | NN all IE all HTML all |
<head>...</head> | HTML End Tag: Optional | The head element contains document information
that is generally not rendered as part of the document in the browser
window. At most, a browser displays the title
element's content in the browser
window's titlebar.
The content of the head element consists entirely
of other elements that are intended to assist the browser in working
with document data. Another classification of data, handled in one or
more meta elements, can also assist search engines
and document parsers to learn more about the document based on
abstract information supplied by the author. The table below shows
the elements that may be nested inside a head
element according to three different specifications.
Although the HTML 4 or XHTML standards do not explicitly support the
id attribute, browsers permit the attribute as
part of their support for W3C DOM common properties of all elements.
Element
|
NN 4+
|
IE 4+
|
HTML 4 and XHTML
|
base
|
•
|
•
|
•
|
basefont
|
•
|
•
|
-
|
bgsound
|
-
|
•
|
-
|
isindex
|
•
|
-
|
•
|
link
|
•
|
•
|
•
|
meta
|
•
|
•
|
•
|
nextid
|
-
|
•
|
-
|
object
|
-
|
-
|
•
|
script
|
•
|
•
|
•
|
style
|
•
|
•
|
•
|
title
|
•
|
•
|
•
|
Example
<head>
<meta name="Author" content="Danny Goodman">
<style type="text/css">
h1 {color:cornflowerblue}
</style>
</head>
Object Model Reference
[window.]document.getElementsByTagName("head")[0]
[window.]document.getElementById(elementID)
Element-Specific Attributes
Element-Specific Event Handler Attributes
None.
profile="URLList" | Optional | A meta data profile is a separate file that defines one or more meta
data property behaviors. The W3C leaves the precise application of
this attribute to the whims of the browsers makers. As of Version 6
browsers, nothing special occurs as a result of assigning this
attribute.
Example
<head profile="http://www.giantco.com/profiles/common">
<meta name="Author" content="Jane Smith">
<meta name="keywords" content="benefits,insurance,">
...
</head>
Value
Any valid URL or browser profile constant.
Default
Browser default.
Object Model Reference
[window.]document.firstChild.firstChild.profile
[window.]document.getElementsByTagName("head")[0].profile
[window.]document.getElementById(elementID).profile
<hr> | NN all IE all HTML all |
<hr> | HTML End Tag: Forbidden | The hr element draws a horizontal rule according
to visual rules built into the browser with a variety of attribute
controls. As a block element, the hr element
starts and ends its rule on its own line, as if the element were
surrounded by br elements. This element is not a
content container, and many of the attributes that have been in use
for a long time are deprecated in HTML 4 in favor of style sheet
rules. The HTML recommendation leaves default appearance
specifications up to the browser maker.
Example
<hr align="center" width="80%">
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
align
|
color
|
noshade
|
size
|
width
|
Element-Specific Event Handler Attributes
None.
align | NN all IE all HTML 3.2 |
Determines how the hr element is rendered in
physical relation to the next outermost container (usually the
body or html element). The
align attribute is deprecated in HTML 4 in favor
of the align style sheet attribute.
Example
<hr align="right">
Value
One of three case-insensitive values: center |
left | right.
Default
center
Object Model Reference
[window.]document.getElementById(elementID).align
color | NN n/a IE 4 HTML n/a |
color="colorTripletOrName" | Optional | Sets the color of the hr element in Internet
Explorer. Setting the color attribute also turns
on the noshade attribute. If you want a 3-D effect
rule to appear with a color, use the style sheet
color attribute. Navigator 4 and later, however,
doesn't apply color style sheet rules to
hr elements.
Example
<hr color="salmon">
Value
A hexadecimal triplet or plain-language color name. See Appendix A for acceptable plain-language color names.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).color
noshade | NN all IE all HTML 3.2 |
The presence of the noshade attribute tells the
browser to render the rule as a flat (not 3-D) line. In Internet
Explorer only, if you set the color attribute, the
browser changes the default line style to a no-shade style.
Example
<hr noshade>
Value
The presence of the attribute turns on no-shade rendering.
Default
Off.
Object Model Reference
[window.]document.getElementById(elementID).noShade
size | NN all IE all HTML 3.2 |
size="pixelCount" | Optional | You can override the default thickness of the hr
element by assigning a value to the size
attribute. The size attribute is deprecated in
HTML 4 in favor of the height style sheet
attribute.
Example
<hr size="4">
Value
Any positive integer. A setting of zero still draws a one-pixel thick
rule.
Default
2
Object Model Reference
[window.]document.getElementById(elementID).size
width | NN all IE all HTML 3.2 |
Defines the precise pixel width or percentage of available width
(relative to the containing element) to draw the
hr element rule. This attribute is deprecated in
HTML 4 in favor of the width style sheet
attribute.
Example
<hr width="75%">
Value
Any length value in pixels or percentage of available space.
Default
100%
Object Model Reference
[window.]document.getElementById(elementID).width
<html> | NN all IE all HTML all |
<html>...</html> | HTML End Tag: Optional | The html element is the container of the entire
document content, including the head element.
Typically, the html element start tag is the
second line of an HTML file, following the Document Type Definition
(DTD) statement (see the DOCTYPE element earlier
in this chapter). If no DTD is provided in the file (it assumes the
browser's default DTD), the html
start tag becomes the first line of the file. The end tag should be
in the last line of the file (but it does not have to stand on its
own line).
Although the html element doesn't
render per se, it is the root positioning context of a document in a
purely W3C-compliant environment. This applies to Netscape 6 and IE
6, the latter only when certain DOCTYPE
definitions start the document. Otherwise, IE for Windows (this goes
for IE 4 through IE 5.5) treats the body element
as the root positioning context. If you don't
specify margins, borders, or padding for the body
element, you probably won't notice the difference.
The HTML 4 and XHTML standards do not include explicit support for
id, class, or
style attributes, but modern DHTML browsers
support them.
Example
<html>
<head>
...
</head>
<body>
...
</body>
</html>
Element-Specific Attributes
Element-Specific Event Handler Attributes
None.
scroll | NN n/a IE 6 HTML n/a |
scroll="featureSwitch" | Optional | When IE 6 is in standards-compliant mode (see the
DOCTYPE element earlier in this chapter), it
treats the html element as the
"canvas" on which it draws the
document content. By default, the canvas gains scrollbars if the
content overflows the content region of the window. You can force the
display of scrollbars (on or off) regardless of the overflow state by
setting the scroll attribute in the
html element. If your pages will also be loading
into older IE/Windows versions, set the same attribute in the
body element — the
"canvas" for older versions.
Example
<html scroll="no">...</html>
Value
String constant: auto | no |
yes.
Default
auto
Object Model Reference
[window.]document.getElementById(elementID).scroll
version | NN 6 IE 6 HTML 3.2 |
The version attribute is deprecated in HTML 4 and
was never adopted by the major browsers until the desire to claim
standards compliance led the maker to introduce the dead-end
attribute. Originally intended to specify the HTML DTD version
supported by the document, this information is universally supplied
in the separate DTD statement (in the DOCTYPE
element) above the html element in the document.
Do not use this attribute.
Value
Any string of characters. The string must be inside a matching pair
of (single or double) quotation marks.
Default
None.
xmlns | NN n/a IE 5 HTML X1.0 |
xmlns="namespaceSpec" | Optional | The W3C attribute and its fixed URI value should be in the
html element of every XHTML document. Microsoft
uses this attribute to allow IE 5 and later for Windows to reference
elements that belong to non-HTML sources, such as the Microsoft
implementation of behaviors (generic external script modules that can
be applied to any element).
Example (IE 5+/Windows)
<html xmlns:MSIE>...</html>
Value
For XHTML, a fixed URI string:
http://www.w3.org/1999/xhtml. For IE 5 and later
namespace references, just a prefix name (MSIE for
built-in behaviors), or a prefix and URI that acts as an additional
identifier for the prefix. Note the colon delimiter.
Default
None.
<i> | NN all IE all HTML all |
<i>...</i> | HTML End Tag: Required | The i element—one of several font style
elements in HTML 4—renders its content in an italic version of
the font face governing the next outermost HTML container. You can
nest multiple font style elements to create combined styles, such as
bold italic (<b><i>bold-italic
text</i></b>).
It is up to the browser to italicize a system font or perhaps load an
italic version of the currently specified font. If you are striving
for font perfection, it is best to use style sheets (and perhaps
downloadable fonts) to specify a true italic font family, rather than
risk the browser's extrapolation of an italic face
from a system font.
You can take advantage of the containerness of this element by
assigning style sheet rules to some or all i
elements in a page. For example, you may wish all
i elements to be in a red color. By assigning the
style rule i{color:red}, you can apply the color
to all elements with only a tiny bit of code.
Although this element is not deprecated in HTML 4, it would not be
surprising to see it lose favor to the font-style
style sheet attribute in the future.
Example
<p>This product is <i>new</i> and <i>improved</i>!</p>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<iframe>...</iframe> | HTML End Tag: Required | An iframe element creates an inline frame within
the natural flow of a document's content. The frame
is a rectangular space into which you may load any other HTML
document (or use scripts to dynamically write content to the space).
If you assign a value to the name attribute of an
iframe element, you may supply that name as the
value of a target attribute of
a, form, or other element that
lets you define a target for a destination or returned document.
Although an iframe element's
rectangular space begins immediately following the content that comes
before it (including in a line of text), all content following the
end tag starts on the next line following the frame rectangle. Text
leading up to the iframe element can be aligned in
the same ways that text can be aligned around an
img or object element.
Content between the start and end tags is ignored by browsers that
support the iframe element. All others display
such content as inline HTML content (as a way to let users know what
they're missing and perhaps provide a link to
related information). The Navigator 4 element that comes closest to
the functionality and behavior of the iframe
element is the ilayer element.
Because an iframe element draws its content from a
separate server file, it may be used as a way to accomplish
client-side "includes" (see Chapter 5). In most respects, an
iframe behaves like a frame
element, but without the need for a frameset. In fact, the element
acts so much like a frame that if you reference it through frame
referencing syntax
(window.frameName), the
returned object is the same type as a window
object, rather than a frame element object.
While the iframe element validates in the
transitional HTML 4 DTD along with the frame and
frameset elements, only the
iframe validates in the transitional XHTML DTD.
The iframe validates in the frameset DTDs for HTML
4 and XHTML.
Example
<iframe src="quotes.html" width="150" height="90">
<a href="quotes.html" target="new" style="color:darkred">
Click here to see the latest quotes </a>
</iframe>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
align
|
datafld
|
datasrc
|
frameborder
|
height
|
hspace
|
longdesc
|
marginheight
|
marginwidth
|
name
|
scrolling
|
security
|
src
|
vspace
|
width
|
Element-Specific Event Handler Attributes
None.
align="alignmentConstant" | Optional | Determines how the rectangle of the iframe element
aligns within the context of surrounding content. See Section 8.1.5
earlier in this chapter for a description of the possibilities
defined for this element's attribute.
Example
<iframe src="quotes.html" width="150" height="90" align="center"></iframe>
Value
Case-insensitive constant value.
Default
left
Object Model Reference
[window.]document.getElementById(elementID).align
datafld | NN n/a IE 4 HTML n/a |
datafld="columnName" | Optional | Used with IE data binding to associate a remote data source column
name in lieu of a src attribute for an
iframe element. The data source column must
contain a valid URI (relative or absolute). A
datasrc attribute must also be set for the
element. Works only with text file data sources in IE 5/Mac.
Example
<iframe datasrc="DBSRC3" datafld="newsURL"></iframe>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).dataFld
datasrc | NN n/a IE 4 HTML n/a |
datasrc="dataSourceName" | Optional | Used with IE data binding to specify the ID of the
page's object element that loads
the data source object for remote data access. Content from the data
source is specified via the datafld attribute.
Works only with text file data sources in IE 5/Mac.
Example
<iframe datasrc="DBSRC3" datafld="newsURL"></iframe>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).dataSrc
frameborder | NN 6 IE 3 HTML 4 |
frameborder="borderSwitch" | Optional | Controls whether the iframe element displays a
border. If you want linked-in documents to look as if they are
embedded as part of the main document, turn off the
frameborder attribute.
Example
<iframe src="quotes.html" width="150" height="90" frameborder="no"></iframe>
Value
On-off values for this attribute vary with the source. HTML 4
specifies the values of 1 (on) and
0 (off). Internet Explorer 4 and Netscape 6 accept
the HTML value and yes or no.
Default
1
Object Model Reference
[window.]document.getElementById(elementID).frameBorder
height, width | NN 6 IE 4 HTML 4 |
height="length"
width="length" These attributes establish the dimensions of the
iframe element. IE 4.5 or later on the Mac is
required. Both attributes are deprecated in HTML 4 in favor of CSS
height and width style
attributes.
Example
<iframe src="news.html" height="200" width="200">
Value
Any length value in pixels or percentage of available space.
Default
A width of 300 pixels; a height of 150 pixels.
Object Model Reference
[window.]document.getElementById(elementID).height
[window.]document.getElementById(elementID).width
hspace, vspace | NN n/a IE 4 HTML n/a |
hspace="pixelCount"
vspace="pixelCount" These attributes set padding around an iframe
element within the content flow. The hspace
attribute controls padding along the left and right edges (horizontal
padding), and the vspace attribute controls
padding along the top and bottom edges (vertical padding). Adding
such padding provides an empty cushion around the frame. As an
alternate (and to achieve cross-browser compatibility), you can
specify the various margin style sheet settings, especially if you
want to open space along only one edge.
Example
<iframe src="news.html" hspace="20" vspace="10">
Value
Any positive integer.
Default
0
Object Model Reference
[window.]document.getElementById(elementID).hspace
[window.]document.getElementById(elementID).vspace
Specifies a URL of a document that contains a longer description of
the element than what the content of the title
attribute reveals. One application of this attribute in future
browsers is to retrieve an annotated description of the element for
users who cannot read the browser screen. The Properties choice for Netscape
6's context menu for this element displays a small
window that includes an active link to the URL assigned to the
attribute. Version 6 browsers provide no other functionality for this
attribute.
Example
<iframe longdesc="newsDesc.html" title="Navigation Bar" src="news.html">
</iframe>
Value
Any valid URI, including complete and relative URLs.
Default
None.
marginheight, marginwidth | NN 6 IE 3 HTML 4 |
marginheight="pixelCount"
marginwidth="pixelCount" Determine the number of pixels between the inner edge of a frame and
the content rendered inside the frame. The
marginheight attribute controls space along the
top and (when scrolled) the bottom edges of a frame; the
marginwidth attribute controls space on the left
and right edges of a frame. The HTML 4 specification leaves default
behavior up to browsers.
Browsers insert their default margins (in the range between 8 and 14
pixels) inside a frame. But if you attempt to override the default
behavior, be aware that setting any one of these two attributes
causes the value of the other to go to zero. Therefore, unless you
want the content to be absolutely flush with various frame edges, you
need to assign values to both attributes.
Example
<iframe src="news.html" marginheight="20" marginwidth="14"></iframe>
Value
Any positive integer value or zero.
Default
Varies with browser and operating system.
Object Model Reference
[window.]document.getElementById(elementID).marginHeight
[window.]document.getElementById(elementID).marginWidth
name="elementIdentifier" | Optional | When links and forms must load their destination or returned
documents into frames other than the one holding the link or form,
those elements have target attributes indicating
which frame receives the new content. To direct such content to a
frame, the frame must have a value assigned to its
name attribute. That same value is assigned to the
target attribute of the a or
form element.
Example
<iframe name="news" id="news" src="news.html"></iframe>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).name
scrolling | NN 6 IE 3 HTML 4 |
scrolling="featureSwitch" | Optional | By default, browsers add vertical and/or horizontal scrollbars when
the content loaded into an inline frame exceeds the visible content
region of the element. Scrollbars can affect the layout of some
content because they occupy space normally devoted to content (that
is, the frame does not expand to accommodate scrollbars). Also, due
to differences in default font sizes in browsers and operating system
versions, a given collection of text content may display differently
in different clients. If you want to prevent scrollbars from
appearing in the frame, set the scrolling
attribute to no; if you want scrollbars to be in
the frame at all times, set the attribute to yes.
In the latter case, if the content does not require scrolling, the
scrollbars are visible, but disabled.
Setting the scrolling attribute to
no should be used only after you have tested that
mission-critical content is always visible in the frame on all
browsers and platforms. If the frame is set to not scroll, some users
might not be able to see all content of the frame.
In lieu of this attribute, you may also use the CSS
overflow style attribute. Microsoft provides extra
axis-specific control over scrollbars via their
overflow-x and overflow-y style
attributes.
Example
<iframe src="news.html" scrolling="no"></iframe>
Value
Constant values: auto | no |
yes.
Default
auto
Object Model Reference
[window.]document.getElementById(elementID).scrolling
security | NN n/a IE 6 HTML n/a |
security="restricted" | Optional | When activated, this attribute raises the security level of the
inline frame to the Restricted level of the Windows Security
preferences settings. Such a frame's content may not
execute scripts.
Example
<iframe src="news.html" security="restricted">
Value
Constant value: restricted.
Default
None.
Defines the URL of the content to be loaded into the
iframe element. The URL can be an absolute URL or
one relative to the URL of the document containing the frameset
specifications. You may also use the javascript:
pseudo-URL to have the returned value of a script appear in the
frame. If you omit the src attribute, the frame
opens empty.
Example
<iframe src="news.html"></iframe>
Value
A complete or relative URL or a javascript:
pseudo-URL.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).src
See hspace.
See height.
<ilayer> | NN |4| IE n/a HTML n/a |
<ilayer>...</ilayer> | HTML End Tag: Required | An ilayer element is an inline version of the
Navigator 4-specific layer element. In some
respects, the ilayer element works like the
iframe element in Internet Explorer, but an
ilayer is automatically regarded as a positionable
element in Navigator 4's object model (e.g., like a
block-level element with a CSS position: attribute
set to relative). As a result, many of the attributes are the same as
the layer element and are named according to the
Navigator 4 way of positioning, sizing, and stacking positionable
elements.
Content for an ilayer element can be read in from
a separate file (with the src attribute) or wired
into the current document by placing the HTML between the start and
end tags. You can include both types of content in the same
ilayer element. Content from the
src document is rendered first (as its own
block-level element), with additional content starting on its own
line below the external content's rectangle.
Example
<ilayer id="thingy1" src="quotes.html" width="150" height="90"></ilayer>
Object Model Reference
[window.]document.layerName
Element-Specific Attributes
above
|
background
|
below
|
bgcolor
|
clip
|
height
|
id
|
left
|
name
|
src
|
top
|
visibility
|
width
|
z-index
|
|
Element-Specific Event Handler Attributes
Handler
|
NN
|
IE
|
HTML
|
onblur
|
4
|
n/a
|
n/a
|
onfocus
|
4
|
n/a
|
n/a
|
onload
|
4
|
n/a
|
n/a
|
onmousedown
|
4[10]
|
n/a
|
n/a
|
onmouseout
|
4a
|
n/a
|
n/a
|
onmouseover
|
4a
|
n/a
|
n/a
|
onmouseup
|
4a
|
n/a
|
n/a
|
[10]Event capture mode only.
above | NN |4| IE n/a HTML n/a |
Names the positionable element that is to be above (in front of) the
current ilayer in the stacking order. This is a
different way to set the z-index attribute that
does not rely on an arbitrary numbering system. If you use the
above attribute, do not use the
below or z-index attribute for
the same ilayer element.
Example
<ilayer id="thingy4" src="quotes.html" above="thingy3"></ilayer>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.layerName.above
background | NN |4| IE n/a HTML n/a |
Specifies an image file that is used as a backdrop to the text and
other content of the ilayer element. Unlike normal
images that get loaded into browser content, a background image loads
in its original size (without scaling) and tiles to fill the
available layer space. Smaller images download faster but are
obviously repeated more often in the background. Animated GIFs are
also allowable but very distracting to the reader. When selecting a
background image, be sure it is very muted in comparison to the main
content so that the content stands out clearly. Background images, if
used at all, should be extremely subtle.
Example
<ilayer id="thingy4" src="quotes.html" background="blueCrinkle.jpg"></ilayer>
Value
Any valid URL to an image file, including complete and relative URLs.
Default
None.
Object Model Reference
[window.]document.layerName.background
below | NN |4| IE n/a HTML n/a |
Names the positionable element that is to be below (behind) the
current ilayer in the stacking order. This is a
different way to set the z-index attribute that
does not rely on an arbitrary numbering system. If you use the
below attribute, do not use the
above or z-index attribute for
the same ilayer element.
Example
<ilayer id="thingy4" src="quotes.html" below="thingy5"></ilayer>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.layerName.below
bgcolor | NN |4| IE n/a HTML n/a |
bgcolor="colorTripletOrName" | Optional | Establishes a fill color (behind the text and other content) for the
entire layer rectangle. If you combine a bgcolor
and background, any transparent areas of the
background image let the background color show through.
Example
<ilayer src="quotes.html" bgcolor="tan"></ilayer>
Value
A hexadecimal triplet or plain-language color name. A setting of
empty is interpreted as "#000000" (black). See
Appendix A for acceptable plain-language color
names.
Default
Varies with operating system.
Object Model Reference
[window.]document.layerName.bgColor
clip | NN |4| IE n/a HTML n/a |
clip="[leftPixel,
topPixel,]
rightPixel,
bottomPixel" A clipping region is a rectangular view to the full
ilayer content. Only content that is within the
clipping rectangle can be seen on the page. The default value of the
clip attribute is determined by the space required
to display the content as it naturally flows into the element.
Setting the clip attribute lets you rein in long
content that might flow beyond a fixed rectangle desired for the page
design.
Example
<ilayer src="quotes.html" clip="50,50"></ilayer>
Value
clip attribute values are pixel measures from the
top and left edges of the element as it flows in the document. The
order of values is clockwise from the left edge, around the rectangle
sides: left, top, right, bottom. If you supply only two values,
Navigator assumes the left and top values are zero, meaning that you
wish to adjust only the right and bottom edges. Thus, a setting of
"50,50" means that the clipping region is
50-pixels square, starting at the top-left corner of the
layer's rectangle. If you want the same size view,
but starting 10 pixels in from the left, the clip
attribute setting becomes "10,0,60,50".
Default
Naturally flowing viewing area of ilayer content.
Object Model Reference
[window.]document.layerName.clip.left
[window.]document.layerName.clip.top
[window.]document.layerName.clip.right
[window.]document.layerName.clip.bottom
height, width | NN |4| IE n/a HTML n/a |
height="length"
width="length" Define the minimum size of the layer as it flows in the document.
When you add content to the layer, however, the attribute settings do
not restrict the amount of the content that is visible along either
axis. For example, if you display an image in an
ilayer that is 120 pixels wide by 90 pixels high,
the actual visible size of an ilayer element whose
height and width attributes are
set to a smaller size expands to allow the full image to appear. The
same happens to text or other content: the viewable region expands to
allow all content to appear. To restrict the visible portion of the
content, set the clip attribute.
Setting the height and width
attributes to specific sizes is helpful when you are creating a
colored or patterned rectangle (via the bgcolor or
background attributes) to act as an underlying
layer beneath some other positioned content. Without content pushing
on the edges of the ilayer, the
height and width attributes set
the clipping region to their sizes.
Example
<ilayer bgcolor="yellow" height="100" width="100"></ilayer>
Value
Positive integer values (optionally quoted) or percentage values
(quoted). You can reduce both values to zero to not only hide the
element (which you can also do with the visibility
attribute), but prevent the element from occupying any page space.
Default
Naturally flowing viewing area of ilayer content.
Object Model Reference
[window.]document.layerName.height
[window.]document.layerName.width
id="elementIdentifier" | Optional | A unique identifier that distinguishes this element from all the rest
in the document. This is the identifier used as values for the
above and below attributes.
Scripts also use the id attribute value as the
ilayer element's name for object
references.
Example
<ilayer id="oldYeller" bgcolor="yellow" height="100" width="100"></ilayer>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.layerName.name
left, top | NN |4| IE n/a HTML n/a |
left="pixelCount"
top="pixelCount" Define the positioned offset of the left and top edges of the layer
relative to the spot in the document where the
ilayer element would normally appear. The precise
location relative to the page varies because an
ilayer element is an inline layer, which means it
can start anywhere within normally flowing HTML content. When you set
either of these attributes, Navigator 4 preserves the space in the
document where the ilayer element appears, rather
than cinch up surrounding content to fill space vacated by the
element that has shifted its location. You are therefore likely to
set these attributes for an ilayer only when
attempting to accomplish a look tailored to very customized content
(perhaps an ilayer amid inflow images).
Example
<ilayer bgcolor="yellow" left="10" top="50"></ilayer>
Value
Positive integer values (optionally quoted).
Default
0
Object Model Reference
[window.]document.layerName.left
[window.]document.layerName.top
name | NN |4| IE n/a HTML n/a |
name="elementIdentifier" | Optional | A unique identifier that distinguishes this element from all the rest
in the document. This is the identifier used as values for the
above and below attributes. The
name attribute is interchangeable with the
id attribute for object references.
Example
<ilayer name="oldYeller" bgcolor="yellow" height="100" width="100"></ilayer>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.layerName.name
src | NN |4| IE n/a HTML n/a |
To load the content of an external HTML file into an
ilayer element, assign the URL of that file to the
src attribute. Any HTML content between the
ilayer start and end tags is rendered on the page
after the content loaded from the src URL. If you
omit the src attribute, only content between the
tags is rendered. Scripts can change the corresponding object
property (src) after the document has loaded to
dynamically change content within the ilayer
element (without reloading the main document).
Example
<ilayer src="quotes.html"></ilayer>
Value
A complete or relative URL.
Default
None.
Object Model Reference
[window.]document.layerName.src
See left.
visibility | NN |4| IE n/a HTML n/a |
visibility="visibilityConstant" | Optional | Determines whether Navigator 4 displays the ilayer
element. The default behavior is for a layer to inherit the
visibility attribute of its next outermost
(parent) layer. For an ilayer element that is part
of the basic document body, this means that the layer is seen by
default (the base layer is always visible). To hide a layer when the
page loads, set the visibility attribute to
"hidden". You need to set the attribute to
"show" only if the ilayer
element is nested within another layer with a
visibility value that is set to (or is inherited
as) "hidden".
Regardless of the visibility attribute setting, an
ilayer element always occupies its normal inflow
space in the document. This allows Navigator 4 to change the
visibility on the fly (via scripting) without reloading the document.
(Navigator 4 does not automatically reflow changed content.)
Example
<ilayer src="quotes.html" visibility="hidden"></ilayer>
Value
One of the accepted constants: hidden |
inherit | visible.
Default
inherit
Object Model Reference
[window.]document.layerName.visibility
See height.
z-index | NN |4| IE n/a HTML n/a |
z-index="layerNumber" | Optional | Controls the positioning of layers along the Z-axis (front-to-back)
of the document relative to the next outermost layer container. When
the z-index values of two or more positionable
elements within the same container (such as the base document layer)
are identical numbers, the loading order of the elements in the HTML
source code controls the stacking order, with the later elements
stacked in front of earlier ones. The default
z-index value for all positionable elements is
zero. Therefore, if you want only one positionable element to appear
in front of all the others that stack in their default order, you
simply assign any positive value (even 1) to that stand-out element.
Stacking order of positionable elements can be changed on-the-fly via
scripting. See also the above and
below attributes.
Example
<ilayer src="quotes.html" z-index="1"></ilayer>
Value
Any integer.
Default
0
Object Model Reference
[window.]document.layerName.zIndex
<img> | NN all IE all HTML all |
<img> | HTML End Tag: Forbidden | The img element displays a graphical image in
whatever MIME types the browser is equipped to handle. Common image
types are GIF and JPEG, but modern browsers are frequently capable of
decoding bitmapped images in PNG and BMP formats (unless helper
application settings reroute those file types to external
applications). img elements are inline elements,
appearing anywhere in the document you specify, including in the
middle of a line of text. A large number of attributes affecting
visual presentation of the element are deprecated in HTML 4 in favor
of style sheet rules. You will be able to use the attributes safely
for many browser generations to come, however, because of the need to
be backward compatible with the large collection of image-laden
documents already on the Web. Note, too, that if you intend to use
style sheets for img element borders and margins
in Navigator 4, you must wrap the img element
inside div or span elements and
assign the style sheets to the surrounding element. This workaround
works with all other CSS-aware browsers, so you can use style sheets
in cross-browser deployment.
If you want to make an entire image a clickable link, wrap the
img element inside an a
element. To eliminate the typical link border around the image, set
the border attribute to 0. And
for image maps (where different segments of an image link to
different destinations), the HTML recommendation encourages the use
of client-side image maps (via the usemap
attribute) over the server-side image map (ismap).
For nonlinking action, you can assign an onclick
event handler to an image in IE 4 and later and Netscape 6. The
downside is that you'll have to control the cursor
style with other events because the :hover
pseudo-class works reliably (if at all) only on a
elements.
To be backward compatible with earlier scriptable browsers, it is
advisable to include height and
width attribute assignments in all
img element tags. When values are assigned to
these attributes, the browser renders pages more quickly because it
doesn't have to wait for the image to load in order
to determine its size and organize other content on the page.
Example
<img src="mtRushmore.jpg" height="90" width="120" alt="Mount Rushmore">
Object Model Reference
[window.]document.imageName
[window.]document.images[i]
[window.]document.getElementById(elementID)
Element-Specific Attributes
align
|
alt
|
border
|
datafld
|
datasrc
|
dynsrc
|
galleryimage
|
height
|
hspace
|
ismap
|
longdesc
|
loop
|
lowsrc
|
name
|
src
|
start
|
suppress
|
usemap
|
vspace
|
width
|
Element-Specific Event Handler Attributes
Handler
|
NN
|
IE
|
HTML
|
onabort
|
3
|
4
|
n/a
|
onerror
|
3
|
4
|
n/a
|
onload
|
3
|
4
|
n/a
|
align | NN all IE all HTML all |
Determines how the img element is rendered in
physical relation to the element's next outermost
container and surrounding content. Some settings also let you
"float" the image to the left or
right margin and let surrounding text wrap around the image (but no
wrapping with a centered image).
Most of the rules for alignment-constant values cited at the
beginning of this chapter apply to the img
element. Typically, align attributes are
deprecated in HTML 4 in favor of the style sheet attributes. But if
you require backward compatibility for your document, stick with the
align attribute.
Example
<img src="surferDude.gif" align="right" alt="Surfer" height="100" width="200">
Value
Each browser defines a different set of values for this attribute.
Although the align attribute has a long heritage,
not all values do. The more esoteric values, such as
absmiddle and baseline, were
added to browser offerings in Navigator 3 and Internet Explorer 4,
but not added to the W3C repertoire. Assigning different values to
multiple images in the same vicinity on the page can result in
unpredictable rendering and positioning of the images and surrounding
content. Select value(s) from the following table that work for your
deployment.
Value
|
NN 4+
|
IE 4+
|
HTML 4
|
absbottom
|
•
|
•
|
-
|
absmiddle
|
•
|
•
|
-
|
baseline
|
•
|
•
|
-
|
bottom
|
•
|
•
|
•
|
left
|
•
|
•
|
•
|
middle
|
•
|
•
|
•
|
right
|
•
|
•
|
•
|
texttop
|
•
|
•
|
-
|
top
|
•
|
•
|
•
|
Default
bottom
Object Model Reference
[window.]document.imageName.align
[window.]document.images[i].align
[window.]document.getElementById(elementID).align
alt | NN all IE all HTML all |
alt="textMessage" | Required | In a world littered with graphical browsers, it is often hard to
remember that not every browser downloads images or that not every
web surfer can see the images. Aside from those using VT100 terminals
with browsers such as Lynx, pocket computers often offer better
performance when images don't have to be downloaded
and rendered. Vision impaired users may not be able to see an image,
but could benefit by knowing what an image is about. Text-only
browsers display the text assigned to an img
element's alt attribute where the
img element appears on the page. Browsers that
speak the page's text also speak the
alt text. The alt attribute
should contain a brief description of what the image is (or an empty
string for images used as space fillers). The HTML recommendation
considers this capability so important that it calls the
alt attribute a requirement for the
img element.
Example
<img src="navbar.gif" usemap="#nav" alt="Navigation Bar" width="400" height="50">
Value
Any quoted string of characters.
Default
None.
Object Model Reference
[window.]document.imageName.alt
[window.]document.images[i].alt
[window.]document.getElementById(elementID).alt
border | NN all IE all HTML 3.2 |
Controls the thickness of a border around an img
element. Default rendering of the border is in black, but if the
img element is wrapped inside an
a element, the border takes on the
document's various link colors (depending on link
state). If you want a different color for a plain border, use style
sheets (with the appropriate div or
span wrapper for Navigator 4). When a link
surrounds the image, you can eliminate the colored border altogether
by setting the border attribute value to zero.
Example
<img src="surferDude.gif" alt="Surfer" border="3" height="100" width="200">
Value
Any integer pixel value.
Default
0
Object Model Reference
[window.]document.imageName.border
[window.]document.images[i].border
[window.]document.getElementById(elementID).border
datafld | NN n/a IE 4 HTML n/a |
datafld="columnName" | Optional | Used with IE data binding to associate a remote data source column
name with the src attribute URL of an
img element. A datasrc
attribute must also be set for the img element.
Works only with text file data sources in IE 5/Mac.
Example
<img datasrc="DBSRC3" alt="Current Radar" datafld="img3URL" height="100" width="150">
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.imageName.dataFld
[window.]document.images[i].dataFld
[window.]document.getElementById(elementID).dataFld
datasrc | NN n/a IE 4 HTML n/a |
datasrc="dataSourceName" | Optional | Used with IE data binding to specify the ID of the
page's object element that loads
the data source object for remote data access. Content from the data
source is specified via the datafld attribute.
Works only with text file data sources in IE 5/Mac.
Example
<img datasrc="DBSRC3" alt="Current Radar" datafld="img3URL" height="100" width="150">
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.imageName.dataSrc
[window.]document.images[i].dataSrc
[window.]document.getElementById(elementID).dataSrc
dynsrc | NN n/a IE 4 HTML n/a |
Internet Explorer 4 and later allows video clips (and VRML) to be
displayed via the img element (as an alternate to
the embed or object element).
To help the browser differentiate between a dynamic and static image
source, you use the dynsrc attribute in place of
the src attribute to load the video clip. All
other visual aspects of the img element are
therefore immediately applicable to the rectangular region devoted to
playing the video clip. See also the loop
attribute for controlling the frequency of clip play and the
start attribute.
Example
<img dynsrc="snowman.avi" loop="3" height="100" width="150">
Value
Any valid URL, including complete and relative URLs.
Default
None.
Object Model Reference
[window.]document.images[i].dynsrc
[window.]document.imageName.dynsrc
[window.]document.getElementById(elementID).dynsrc
galleryimg | NN n/a IE 6 HTML n/a |
dynsrc="featureSwitch" | Optional | Sets whether images that are at least 130 pixels high and wide
display the Windows OS "My
Pictures" toolbar during mouse rollovers. This tool
bar provides quick-click shortcuts to save, print, or email the
image. You cannot control which buttons appear in the toolbar.
Example
<img src="rushmore.jpg" alt="Mount Rushmore" height="240" width="550" galleryimg="no">
Value
Constant value: yes | true |
no | false.
Default
yes
Object Model Reference
[window.]document.images[i].galleryImg
[window.]document.imageName.galleryImg
[window.]document.getElementById(elementID).galleryImg
height, width | NN all IE all HTML 3.2 |
height="length"
width="length" Define the dimensions for the space on the page reserved for the
image, regardless of the actual size of the image. For best
performance (and backward script compatibility), you should set these
attributes to the actual pixel height and width of the source image.
If you supply a different measure, the browser scales the image (not
very well) to fit the space defined by these attributes.
Example
<img src="surferDude.gif" alt="Surfer" height="100" width="200">
Value
Positive integer values (optionally quoted) or percentage values
(quoted).
Default
Actual size of source image.
Object Model Reference
[window.]document.imageName.height
[window.]document.images[i].height
[window.]document.getElementById(elementID).height
[window.]document.imageName.width
[window.]document.images[i].width
[window.]document.getElementById(elementID).width
hspace, vspace | NN all IE all HTML 3.2 |
hspace="pixelCount"
vspace="pixelCount" Define a margin that acts as whitespace padding around the visual
content of the img element. The
hspace establishes a margin on the left and right
sides of the image rectangle; the vspace
establishes a margin on the top and bottom sides of the image
rectangle. Both attributes are deprecated in HTML 4 in favor of the
margin- or padding-related CSS attributes.
Example
<img src="desk3.gif" alt="My Desktop" vspace="10" hspace="10">
Value
Integer representing the number of pixels for the width of the margin
on the relevant sides of the img
element's rectangle.
Default
0
Object Model Reference
[window.]document.imageName.hspace
[window.]document.images[i].hspace
[window.]document.getElementById(elementID).hspace
[window.]document.imageName.vspace
[window.]document.images[i].vspace
[window.]document.getElementById(elementID).vspace
ismap | NN all IE all HTML all |
The Boolean ismap attribute tells the browser that
the img element is acting as a server-side image
map. To turn an image into a server-side image map, wrap the
img element with an a element
whose href attribute points to the URL of the CGI
program that knows how to interpret the click coordinate information.
The browser appends coordinate information about the click to the URL
like a GET form method appends form element data
to the action attribute URL. In the following
example, if a user clicks at the coordinate point 50, 25, the browser
sends
"http://www.giantco.com/cgi-bin/nav.pl?50,25" to
the server. A server CGI program named nav.pl
might examine the region in which the coordinate point appears and
send the relevant HTML back to the client.
More recent browsers allow client-side image maps (see the
usemap attribute), which operate more quickly for
the user because there is no communication with the server to carry
out the examination of the click coordinate point.
Example
<a href="http://www.giantco.com/cgi-bin/nav" target="main">
<img src="navbar.gif" alt="Navigation Bar" ismap height="90" width="120">
</a>
Value
The presence of the attribute turns the feature on.
Default
Off.
Object Model Reference
[window.]document.imageName.isMap
[window.]document.images[i].isMap
[window.]document.getElementById(elementID).isMap
Specifies a URL of a document that contains a longer description of
the element than what the content of the alt or
title attributes reveal. One application of this
attribute in future browsers is to retrieve an annotated description
of the element for users who cannot read the browser screen. The
Properties choice for Netscape
6's context menu for this element displays a small
window that includes an active link to the URL assigned to the
attribute. Version 6 browsers provide no other functionality for this
attribute.
Example
<img longdesc="navDesc.html" alt="Navigation Bar" src="navbar.jpg">
Value
Any valid URL, including complete and relative URLs.
Default
None.
Object Model Reference
[window.]document.imageName.longDesc
[window.]document.images[i].longDesc
[window.]document.getElementById(elementID).longDesc
If you specify a video clip with the dynsrc
attribute, the loop attribute controls how many
times the clip should play ("loop")
after it loads. If you set the value to zero, the clip loads but does
not play initially. Video clips that are not currently running play
when the user double-clicks on the image, but you may need to provide
instructions for that on the page because there are no other obvious
controls. This attribute does not control animated
.gif playback.
Example
<img dynsrc="snowman.avi" alt="Snowman Movie"loop="3" height="100" width="150">
Value
Any positive integer or zero.
Default
1
Object Model Reference
[window.]document.imageName.loop
[window.]document.images[i].loop
[window.]document.getElementById(elementID).loop
Both Navigator and Internet Explorer recognize the fact that not
everyone has a fast Internet connection and that high-resolution
images can take a long time to download to the client. To fill the
void, the lowsrc attribute lets the author specify
a URL of a lower-resolution (or alternate) image to download into the
document space first. The lowsrc image should be
the same pixel size as the primary src image.
Example
<img src="navbar.jpg" alt="Navigation Bar" lowsrc="navbarBW.jpg" height="60" width="300">
Value
Any valid URL, including complete and relative URLs.
Default
None.
Object Model Reference
[window.]document.imageName.lowsrc
[window.]document.images[i].lowsrc
[window.]document.getElementById(elementID).lowsrc
name="elementIdentifier" | Optional | If you are scripting an image (especially swapping precached images),
backward-compatible scripting utilizes the name
attribute value to reference the img object
because the id attribute did not exist. References
by name are more reliable than by numeric index within the
document.images array because you can rearrange or
delete images at any time and still maintain references to the
remaining named images. For modern browsers only, you can use the
id attribute value in place of the
name attribute.
Example
<img name="mugshot" id="mugshot" alt="My face" src="janem.jpg" height="90" width="80">
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.images[i].name
[window.]document.imageName.name
[window.]document.getElementById(elementID).name
src | NN all IE all HTML all |
URL to a file containing image data that is displayed through the
img element. With the exception of specifying a
dynsrc attribute in Internet Explorer for video
clips or datasrc for IE data binding, the
src attribute is required if you want to see any
image in the img element space. The browser must
be equipped to handle the image MIME type. On the World Wide Web, the
most common image formats are GIF and JPEG. HTML or XHTML validation,
of course, requires the src attribute and
doesn't accept the IE attribute alternatives.
Example
<img src="surferDude.gif" alt="Surfer" height="100" width="200">
Value
A complete or relative URL.
Default
None.
Object Model Reference
[window.]document.images[i].src
[window.]document.imageName.src
[window.]document.getElementById(elementID).src
start | NN n/a IE 4 HTML n/a |
start="videoStartType" | Optional | Whenever you set the dynsrc attribute of an
img to display a video clip in Internet Explorer,
you can direct the element to start playing the video immediately
after the video file loads or when the user rolls the cursor over the
image. The start attribute lets you decide the
best user interface for your page.
Example
<img dynsrc="snowman.avi" loop="1" start="mouseover" height="100" width="150">
Value
One of the two case-insensitive constant values:
fileopen | mouseover.
Default
fileopen
Object Model Reference
[window.]document.images[i].start
[window.]document.imageName.start
[window.]document.getElementById(elementID).start
suppress | NN |4| IE n/a HTML n/a |
suppress="featureSwitch" | Optional | When engaged, this attribute prevents Navigator 4 from displaying the
generic image icon, alt text, and raised image
area while the image is downloading. If the image fails to load, the
artifacts appear in the image space as if the attribute were not
turned on.
Example
<img src="surferDude.gif" alt="Surfer" height="150" width="250" suppress="true">
Value
Boolean string value: true |
false.
Default
false
usemap | NN all IE all HTML 3.2 |
You can define a client-side image map with the help of the
map and area elements. The
map element is a named container for one or more
area elements. Each area
element sets a "hot" area on an
image and assigns a link destination (and other settings) for a
response to the user clicking in that region. The purpose of the
usemap attribute is to establish a connection
between the img element and a named
map element in the same document. In some
respects, the map element's name
is treated like an anchor in that the
"address" of the
map element is the element's name
preceded by a # symbol.
Example
<img src="navbar.gif" alt="Navigation Bar" usemap="#navigation"
height="90" width="120">
Value
A URL to the map element in the same document (a
hash symbol plus the map name).
Default
None.
Object Model Reference
[window.]document.imageName.useMap
[window.]document.images[i].useMap
[window.]document.getElementById(elementID).useMap
See hspace.
See height.
<input> | NN all IE all HTML all |
<input> | HTML End Tag: Forbidden | An input element is sometimes known as a form
control, although not all input elements are
visible on the page. For the most part, an input
element provides a place for users to enter text, click buttons, and
make selections from lists. The data gathered from this interaction
can be submitted to a server-side program (when the surrounding
form element is submitted), or it may be used
strictly on the client as a way for users to interact with
client-side scripts. Server applications also commonly embed session
data in a page's hidden input elements so that the
data gets submitted with the next form submission—one way to
cascade data gathering across multiple form pages without maintaining
the data temporarily on the server between page deliveries.
Prior to HTML 4, input elements were supposed to
be wrapped by a form element in all instances.
This restriction is loosening up, but Navigator 4 still requires the
form wrapper in order to render
input elements.
The primary attribute that determines the kind of control displayed
on the page is the type attribute. This attribute
can have one of the following values: button,
checkbox, file,
hidden, image,
password, radio,
reset, submit, or
text. Not all input element
types utilize the full range of attributes defined for the
input element; sometimes a single attribute has
different powers with different element types. For each attribute of
the input element, the listing specifies the types
to which it applies. Although the textarea element
has its own tag, it is often treated like another form control.
Example
<form method="POST" action="http://www.giantco.com/cgi-bin/query.pl">
First Name: <input type="text" name="first" id="first" maxlength="15"><br>
Last Name: <input type="text" name="last" id="last" maxlength="25"><br>
ZIP Code: <input type="text" name="zip" id="zip" maxlength="10"><br>
<input type="reset">
<input type="submit">
</form>
Object Model Reference
[window.]document.formName.inputName
[window.]document.forms[i].elements[j]
[window.]document.getElementById(elementID)
Element-Specific Attributes
accept
|
accesskey
|
align
|
alt
|
border
|
checked
|
datafld
|
datasrc
|
disabled
|
dynsrc
|
height
|
hspace
|
ismap
|
loop
|
lowsrc
|
maxlength
|
name
|
readonly
|
size
|
src
|
start
|
type
|
usemap
|
value
|
vspace
|
width
|
|
|
|
|
Element-Specific Event Handler Attributes
Handler
|
NN
|
IE
|
HTML
|
onafterupdate
|
n/a
|
4
|
n/a
|
onbeforeupdate
|
n/a
|
4
|
n/a
|
onchange
|
2
|
3
|
4
|
onselect
|
2
|
3
|
4
|
Not all events are active in all input types.
accept="MIMETypeList" | Optional | Specifies one or more MIME types for allowable files to be uploaded
to the server when the form is submitted. The HTML 4 provides this
attribute in case a browser wishes to incorporate some file type
filtering prior to submitting a form with a file
input element. As of Version 6 browsers, this
attribute has no practical impact on file selection or submission.
Input Types
file
Example
<input type="file" accept="text/html, image/gif" ...>
Value
MIME type (content type) value. For multiple items, a comma-delimited
list is allowed.
Default
None.
accesskey | NN 6 IE 4 HTML 4 |
accesskey="character" | Optional | See the description of this shared attribute at the beginning of this
chapter for general characteristics. For file
input types, pressing the
accesskey combination places the text pointer in
the associated text box, but does not
"click" the Browser button.
Input Types
All rendered types.
align | NN all IE all HTML 3.2 |
align="alignmentConstant" | Optional | Determines how the rectangle of the input image aligns within the
context of the surrounding content. See Section 8.1.5
earlier in this chapter for a description of the possibilities for
this attribute with img elements.
Input Types
image
Example
<input type="image" name="icon" src="icon.gif" align="absmiddle">
Value
Alignment-constant value applied to elements outside the image
rectangle.
Default
left
Object Model Reference
[window.]document.formName.inputName.align
[window.]document.forms[i].elements[j].align
[window.]document.getElementById(elementID).align
alt="textMessage" | Optional | Provides text description of the input element
image while the image downloads, in lieu of rendered images, or for
text-to-speech browsers. Behaves just like the alt
attribute of the img element.
Input Types
image
Example
<input type="image" name="icon" src="sndIcon.gif" alt="Sound Icon">
Value
Any quoted string of characters.
Default
None.
Object Model Reference
[window.]document.formName.inputName.alt
[window.]document.forms[i].elements[j].alt
[window.]document.getElementById(elementID).alt
border | NN 4 IE 4(Mac) HTML n/a |
Navigator 4 and later on all OS platforms and IE 4 and later on the
Mac let you specify a border around the input
element image. Because an input element whose
type attribute is "image" acts
as a submit-style button, the border is rendered in the
browser's link colors, unless overridden by a style
sheet. If you want a different color for a plain border, use style
sheets (with the appropriate div or
span wrapper for Navigator 4). Navigator 4 (only)
places a border around the image by default. Set the
border attribute to zero to remove the border.
Input Types
image
Example
<input type="image" name="icon" src="sndIcon.gif" border="0">
Value
Any integer pixel value.
Default
2 (Navigator 4) or 0 (All
others).
Object Model Reference
[window.]document.formName.inputName.border
[window.]document.forms[i].elements[j].border
[window.]document.getElementById(elementID).border
checked | NN all IE all HTML 4 |
A Boolean attribute that designates whether the current checkbox or
radio input element is turned on when the page
loads. In the case of a radio button grouping, only one
input element should have the
checked attribute. Scripts can modify the internal
value of this attribute after the page has loaded. When the form is
submitted, an input element that has its
checked attribute turned on sends its name/value
pair as part of the form data. The name/value pair consists of values
assigned to the name and value
attributes for the element. If no value is assigned to the
value attribute, the string value
"active" or "on" is
automatically assigned when the checkbox or radio button is
highlighted. This is fine for checkboxes because each one should be
uniquely named. However, all radio buttons in a related group must
have the same name for browsers to handle the automatic highlighting
and unhighlighting within the group. This default characteristic
doesn't provide enough information for most
server-side programs to work with. See the name
attribute below.
Input Types
checkbox, radio
Example
<input type="checkbox" name="addToList" checked>Send email updates to this
web site.
Value
The presence of this attribute turns on its property.
Default
Off.
Object Model Reference
[window.]document.formName.inputName.checked
[window.]document.forms[i].elements[j].checked
[window.]document.getElementById(elementID).checked
datafld | NN n/a IE 4 HTML |4| |
datafld="columnName" | Optional | Used with IE 4 data binding to associate a remote data source column
name with parts of various input elements. A
datasrc attribute must also be set for the
element. Works only with text file data sources in IE 5/Mac.
This attribute was reserved in HTML 4, but was dropped in XHTML 1.0.
Input Types
button, checkbox,
hidden, password,
radio, text
Example
<input type="text" name="first" datasrc="DBSRC3" datafld="firstName">
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.formName.inputName.dataFld
[window.]document.forms[i].elements[j].dataFld
[window.]document.getElementById(elementID).dataFld
datasrc | NN n/a IE 4 HTML |4| |
datasrc="dataSourceName" | Optional | Used with IE data binding to specify the ID of the
page's object element that loads
the data source object for remote data access. Content from the data
source is specified via the datafld attribute.
Works only with text file data sources in IE 5/Mac.
This attribute was reserved in HTML 4, but was dropped in XHTML 1.0.
Input Types
button, checkbox,
hidden, password,
radio, text
Example
<input type="text" name="first" datasrc="DBSRC3" datafld="firstName">
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.formName.inputName.dataSrc
[window.]document.forms[i].elements[j].dataSrc
[window.]document.getElementById(elementID).dataSrc
A disabled input element appears grayed out on the
screen and cannot be activated by the user. A disabled form control
cannot receive focus and does not become active within the tabbing
order rotation. IE/Windows extends this to mean that if one radio
button in a group is disabled, the entire group is disabled. Not so
in IE/Mac or Netscape 6, which let unhighlighted buttons uncheck a
disabled checked member of the group.
The name/value pair of a disabled input element is
not sent to the server when the form is submitted.
input elements that normally perform submissions
do not submit their form when disabled.
The disabled attribute is a Boolean type, which
means that in HTML format, its presence in the attribute sets its
value to true. Its value can also be adjusted
after the fact by scripting (see the button object
in Chapter 9).
Input Types
All.
Example
<button type="submit" disabled>Ready to Submit </button>
Value
The presence of the attribute disables the element.
Default
false
Object Model Reference
[window.]document.formName.inputName.disabled
[window.]document.forms[i].elements[j].disabled
[window.]document.getElementById(elementID).disabled
dynsrc | NN n/a IE 4 HTML n/a |
Internet Explorer 4 and later allows video clips (and VRML) to be
displayed via an image type input element. To help
the browser differentiate between a dynamic and static image source,
you use the dynsrc attribute in place of the
src attribute to load the video clip. All other
visual aspects of the input type input element are
therefore immediately applicable to the rectangular region devoted to
playing the video clip. See also the loop
attribute for controlling the frequency of clip play and the
start attribute.
Input Types
image
Example
<input type="image" dynsrc="submit.avi" alt="Submit Button" loop="3" height="100" width="150">
Value
Any valid URL, including complete and relative URLs.
Default
None.
Object Model Reference
[window.]document.formName.inputName.dynsrc
[window.]document.forms[i].elements[j].dynsrc
[window.]document.getElementById(elementID).dynsrc
height, width | NN 4 IE 4 HTML n/a |
height="pixels"
width="pixels" Defines the dimensions of the image used for the
input element. If you omit these attributes, the
browser waits for the image to load before allocating space on the
page for the element.
Input Types
All.
Example
<input type="image" src="submit.jpg" height="20" width="60">
Value
Positive integers.
Default
Default image size.
hspace, vspace | NN 6 IE 4 HTML n/a |
height="pixels"
width="pixels" Establishes extra padding around the image (and, thus, the
input element) to keep other content at a minimum
distance. The hspace controls the padding
thickness of both the left and right edges; vspace
does the same for top and bottom.
Input Types
All.
Example
<input type="image" src="submit.jpg" alt="Submit Button"
height="20" width="60" hspace="10" vspace="20">
Value
Positive integers.
Default
0
ismap | NN all IE all HTML all |
The Boolean ismap attribute tells the browser that
the image representing the input element is acting
as a server-side image map. Unlike the img
element, the image type input element has an
action (submitting the form) associated with it, so no surrounding
a element is required. The browser appends
coordinate information about the click to the URL of the
form's action. See the usemap
attribute for client-side image map details.
Input Types
image
Example
<input type="image src="navbar.gif" alt="Navigation Bar" ismap height="90" width="120">
Value
The presence of the attribute turns the feature on.
Default
Off.
Object Model Reference
[window.]document.formName.inputName.isMap
[window.]document.forms[i].elements[j].isMap
[window.]document.getElementById(elementID).isMap
If you specify a video clip with the dynsrc
attribute, the loop attribute controls how many
times the clip should play ("loop")
after it loads. If you set the value to zero, the clip loads but does
not play initially. Video clips that are not currently running play
when the user double-clicks on the image, but you may need to provide
instructions for that on the page because there are no other obvious
controls.
Input Types
image
Example
<input type="image" dynsrc="snowman.avi" alt="Snowman Movie" loop="3"
height="100" width="150">
Value
Any positive integer or zero.
Default
1
Object Model Reference
[window.]document.formName.inputName.loop
[window.]document.forms[i].elements[j].loop
[window.]document.getElementById(elementID).loop
lowsrc | NN all IE 4 HTML n/a |
Provides a URL to an alternate low-resolution image to be loaded
initially if the src image is taking a long time
to load.
Input Types
image
Example
<input type="image" src="navbar.jpg" alt="Navigation Bar" lowsrc="navbarBW.jpg"
height="60" width="300">
Value
Any valid URL, including complete and relative URLs.
Default
None.
Object Model Reference
[window.]document.formName.inputName.lowsrc
[window.]document.forms[i].elements[j].lowsrc
[window.]document.getElementById(elementID).lowsrc
maxlength | NN all IE all HTML all |
maxlength="characterCount" | Optional | Defines the maximum number of characters that may be typed into a
text field input element. In practice, browsers
beep or otherwise alert users when a typed character would exceed the
maxlength value. There is no innate correlation
between the maxlength and size
attributes. If the maxlength allows for more
characters than fit within the specified width of the element, the
browser provides horizontal scrolling (albeit awkward for many users)
to allow entry and editing of the field.
Input Types
password, text
Example
<input type="text" name="ZIP" maxlength="10">
Value
Positive integer.
Default
Unlimited.
Object Model Reference
[window.]document.formName.inputName.maxLength
[window.]document.forms[i].elements[j].maxLength
[window.]document.getElementById(elementID).maxLength
name | NN all IE all HTML all |
name="elementIdentifier" | Optional/Required | If the input element is part of a form being
submitted to a server, the name attribute is
required if the value of the element is to be submitted with the
form. For forms that are in documents for the convenience of scripted
form elements, input element names are not
required but are helpful just the same in creating scripted
references to these objects and their properties or methods.
The identifier you assign to the name attribute
becomes part of the name/value pair submitted to the server. Radio
button elements that are to act as a mutually exclusive group must
all have the same name attribute value. In many
browsers, failure to include a name attribute
assignment disallows user access to checkbox or radio
input elements.
The HTML 4 and XHTML specifications encourage using the
id attribute in place of the
name attribute throughout your pages. Mainstream
browsers through Version 6 do not submit data from
input elements bearing an id
assignment but no name assignment. For consistency
with DHTML-scripted DOM access of all elements, it's
good practice to assign both attributes, even using the same
identifier for both (except for radio buttons, whose IDs need to be
unique, while their names are shared). Let the
name attribute carry the
element's value to the server, while scripts reach
the elements via their IDs—especially in browsers that provide
the IE document.all.elementID or W3C DOM
document.getElementById(elementID) referencing
syntax. Perhaps reluctantly, the strict XHTML DTD validates the
name attribute for input
elements so that validated pages will function within the reality of
former and current browser implementations.
Input Types
All.
Example
<input type="text" name="ZIP" id="ZIP" maxlength="10">
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.formName.inputName.name
[window.]document.forms[i].elements[j].name
[window.]document.getElementById(elementID).name
When the readonly attribute is present, the text
field input element cannot be edited on the page
by the user (although scripts can modify the content). A field marked
as readonly should not receive focus within the
tabbing order (although IE 4 and later for the Macintosh allows the
field to receive focus and beeps if a user tries to type).
Input Types
password, text
Example
<input type="text" name="ZIP" readonly>
Value
The presence of the attribute sets its value to
true.
Default
false
Object Model Reference
[window.]document.formName.inputName.readOnly
[window.]document.forms[i].elements[j].readOnly
[window.]document.getElementById(elementID).readOnly
size | NN all IE all HTML all |
size="elementWidth" | Optional | In practice, the size attribute is limited to
describing the width of text field input elements
based on the number of characters that display. The actual rendered
width is calculated based on the font setting (or default font) for
the element, but the results are not always perfect. Variations in
font rendering (and the ability to specify alternate font faces and
sizes in newer browsers) sometimes lead to unexpectedly narrower
fields. Therefore, it is not wise to automatically set the
size and maxlength attributes
to the same value without testing the results on a wide variety of
browsers and operating systems with worst-case data (for example, all
"m" or
"W" characters in proportional
fonts). The HTML 4 specification indicates that the
size attribute might be applied to other
input element types (as pixels, rather than
characters), but as of the Version 6 browsers, this is not the case.
In the meantime, you can use CSS attributes to make buttons wider
than the default size that tracks the width of the
value attribute string.
Input Types
password, text
Example
<input type="text" name="ZIP" maxlength="10" size="12">
Value
Any positive integer.
Default
20
Object Model Reference
[window.]document.formName.inputName.size
[window.]document.forms[i].elements[j].size
[window.]document.getElementById(elementID).size
src | NN all IE all HTML all |
URL to a file containing image data that is displayed through the
input element of type image. The browser must be
equipped to handle the image MIME type. On the World Wide Web, the
most common image formats are GIF and JPEG.
Input Types
image
Example
<input type="image" name="icon" src="sndIcon.gif" border="0">
Value
A complete or relative URL.
Default
None.
Object Model Reference
[window.]document.formName.inputName.src
[window.]document.forms[i].elements[j].src
[window.]document.getElementById(elementID).src
start | NN n/a IE 4 HTML n/a |
start="videoStartType" | Optional | Whenever you set the dynsrc attribute of an image
type input element to display a video clip in
Internet Explorer, you can direct the element to start playing the
video immediately after the video file loads or when the user rolls
the cursor over the image. The start attribute
lets you decide the best user interface for your page.
Input Types
image
Example
<input type="image dynsrc="submit.avi" alt="Submit Button" loop="1"
start="mouseover" height="100" width="150">
Value
One of the two case-insensitive constant values:
fileopen | mouseover.
Default
fileopen
Object Model Reference
[window.]document.formName.inputName.start
[window.]document.forms[i].elements[j].start
[window.]document.getElementById(elementID).start
type | NN all IE all HTML all |
type="elementType" | Required | Advises the browser how to render the input
element (or even whether the element should be rendered at all).
Possible choices are as follows.
Type
|
Description
|
button
|
A clickable button whose action must be scripted. Its label is
assigned by the value attribute. If you want to
use HTML to format the label of a button, use the
button element instead.
|
checkbox
|
A free-standing checkbox that provides two states (active/on and
inactive/off). Its label is created by HTML text before or after the
input element tag (also see the
label element). The value
attribute value is submitted with a form.
|
file
|
A button and field that lets the user select a local file for
eventual uploading to the server. A click of the button generates a
File dialog, and the name (or pathname) of the selected file appears
in the field. The server must have a CGI script (invoked by the
form's action attribute URI) to
accept the incoming file at submission time.
|
hidden
|
An invisible field often used to carry over database or state data
from submission to submission without bothering the user with its
content (or having to store the temporary data on the server). The
name/value pair is submitted with the form.
|
image
|
A graphical button whose sole default action is to submit the form.
The coordinate points x,y of the click on the image are submitted as
two name/value pairs linked by an ampersand character:
inputName.x=n&inputName.y=m.
|
password
|
A text field that presents bullets or asterisks for each typed
character to ensure over-the-shoulder privacy for the user. The
plain-language text is submitted as the value for this element.
|
radio
|
One of a related group of on- off buttons.
Assigning the same value to the name attribute of
multiple radio buttons assembles them in a related group. Clicking on
one button in the group activates it while unhighlighting all others.
The value attribute value of the activated member
is submitted with a form.
|
reset
|
A button whose sole job is to revert the form's
elements to the values they had when the form initially loaded into
the client. A custom label can be assigned via the
value attribute.
|
submit
|
A button whose sole job is to submit the form. A custom label can be
assigned by the value attribute. If
name and value attributes are
assigned for the element, their values are submitted with the form.
|
text
|
A one-line field for typing text that gets submitted as the value of
the element (in a URL-encoded format). For a multiple-line field, see
the textarea element.
|
Input Types
All.
Example
<input type="button" value="Toggle Sound" onclick="toggleSnd( )">
<input type="checkbox" name="connections" value="ISDN">ISDN
<input type="file" name="uploadFile">
<input type="hidden" name="prevState" id="prevState" value="modify">
<input type="image" name="graphicSubmit" src="submit.jpg" height="40" width="40">
<input type="password" name="password" maxlength="12" size="20">
<input type="radio" name="creditCard" value="Visa">Visa
<input type="reset">
<input type="submit" value="Send Encrypted">
Social Security Number:<input type="text" name="ssn" value="###-##-####"
onclick="validateSSN(this)">
Value
Any one of the known input element types:
button | checkbox |
file | hidden |
image | password |
radio | reset |
submit | text.
Default
text
Object Model Reference
[window.]document.formName.inputName.type
[window.]document.forms[i].elements[j].type
[window.]document.getElementById(elementID).type
You can define a client-side image map for an image type
input element with the help of the
map and area elements. The
map element is a named container for one or more
area element. Each area element
sets a "hot" area on an image and
assigns a link destination (and other settings) for a response to the
user clicking in that region. The purpose of the
usemap attribute is to establish a connection
between the image type input element and a named
map element in the same document. In some
respects, the map element's name
is treated like an anchor in that the
"address" of the
map element is the element's name
preceded by a # symbol.
Input Types
image
Example
<input type="image" src="submit.gif" alt="Submit Button" usemap="#submitter"
height="90" width="120">
Value
A URL to the map element in the same document (a
hash symbol plus the map name).
Default
None.
Object Model Reference
[window.]document.formName.inputName.useMap
[window.]document.forms[i].elements[j].useMap
[window.]document.getElementById(elementID).useMap
value | NN all IE all HTML all |
value="text" | Optional/Required | Preassigns a value to an input element that is
submitted to the server as part of the name/value pair for the
element. Some input element types are not
submitted (an unchecked radio button, for example), but any value you
associate with all but the button or reset type
input element reaches the server when the element
is submitted.
In the case of text and password input elements,
the value attribute contains a default entry. As
the user makes a change to the content of the text field, the value
changes, although the source code does not. When a form is reset (via
a reset input element), the default values are put
back into the text fields.
The value attribute is required only for checkbox
and radio input elements. For
input elements that are rendered as standard
clickable buttons, the value attribute defines the
label that appears on the button.
Input Types
All.
Example
<input type="checkbox" name="connections" value="ISDN">ISDN
Value
Any text string.
Default
None.
Object Model Reference
[window.]document.formName.inputName.defaultValue
[window.]document.forms[i].elements[j].defaultValue
[window.]document.getElementById(elementID).defaultValue
[window.]document.formName.inputName.value
[window.]document.forms[i].elements[j].value
[window.]document.getElementById(elementID).value
See hspace.
See height.
<ins>...</ins> | HTML End Tag: Required | The ins element and its companion,
del, define a format that shows which segments of
a document's content have been marked up for
insertion (or deletion) during the authoring process. This is far
from a workflow management scheme, but in the hands of a supporting
WYSIWYG HTML authoring tool, these elements can assist in controlling
generational changes of a document in process.
Browsers that support this element render text contained by the
element as underlined (whereas del elements are in
a strikethrough style). The HTML 4 specification includes two
potentially useful attributes for preserving hidden information about
the date and time of the alteration and some descriptive text about
the change.
Example
<p>Four score and
<del cite="Fixed the math">eight</del><ins>seven</ins> years ago...</p>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
Element-Specific Event Handler Attributes
None.
A description of the reason for the change or other notation to be
associated with the element, but normally hidden from view. In
Netscape 6, the context menu for such an element contains a Properties choice, which leads to a displayed
list of attributes and their values for the visitor. Or, your DHTML
scripts can access the information through the element
object's cite property, and add
value to the presentation.
Example
<ins cite="Fixed the math --A.L.">seven</ins>
Value
Any string of characters. The string must be inside a matching pair
of (single or double) quotation marks.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).cite
datetime="datetimeString" | Optional | The date and time the insertion was made. This information is most
likely to be added into a document with an HTML authoring tool
designed to track content insertions and deletions. Data from this
attribute can be recalled later as an audit trail to changes of the
document. There can be only one datetime attribute
value associated with a given ins element. In
Netscape 6 the context menu for such an element contains a Properties choice, which leads to a displayed
list of attributes and their values for the visitor. Or, your DHTML
scripts can access the information through the element
object's dateTime property, and
add value to the presentation.
Example
<ins datetime="2001-09-11T08:56:00-04:00">SomeInsertedTextHere</ins>
Value
The datetime attribute requires a value in a
special date-time format that conveys information about the date and
time in such a way that the exact moment can be deduced from any time
zone around the world. Syntax for the format is as follows:
yyyy-MM-ddThh:mm:ssTZD.
- yyyy
-
Four-digit year
- MM
-
Two-digit month (01 through 12)
- dd
-
Two-digit date (01 through 31)
- T
-
Uppercase "T" to separate date from
time
- hh
-
Two-digit hour in 24-hour time (00 through 23)
- mm
-
Two-digit minute (00 through 59)
- ss
-
Two-digit second (00 through 59)
- TZD
-
Time Zone Designator
There are two formats for the Time Zone Designator. The first is
simply the uppercase letter "Z",
which stands for UTC (Coordinated Universal Time—also called
"Zulu"). The other format indicates
the offset from UTC that the time shown in
hh:mm:ss represents. This time offset
consists of a plus or minus symbol and another pair of
hh:mm values. For time zones west of
Greenwich Mean Time (which, for all practical purposes is the same as
UTC), the operator is a negative sign because the main
hh:mm:ss time is earlier than UTC; for
time zones east of GMT, the offset is a positive value. For example,
Pacific Standard Time is eight hours earlier than UTC: when it is
6:00 P.M. in the PST zone, it is 2:00 A.M. the next morning at UTC.
Thus, the following examples all represent the exact same moment in
time (Time Zone Designator shown in boldface for clarification only):
2003-01-30T02:00:00Z
|
UTC
|
2003-01-29T21:00:00-05:00
|
Eastern Standard Time
|
2003-01-29T18:00:00-08:00
|
Pacific Standard Time
|
2003-01-30T13:00:00+11:00
|
Sydney, Australia
|
For more details about this way of representing time, see the
ISO-8601 standard.
Default
None.
<isindex> | NN all IE all HTML all |
<isindex> | HTML End Tag: Forbidden | The isindex element is a longtime holdover from
the earliest days of HTML and is deprecated in HTML 4 in favor of the
text input element. The isindex
element tag belongs in the head element. In modern
browsers, it is rendered as a simple text field between two
hr elements. When a user types text into the field
and presses the Enter/Return key, the content of the field is
URL-encoded (with + symbols substituted for
spaces) and sent to the server with the URL of the current document.
A CGI program on the server must know how to process this URL and
return HTML for display in the current window or frame.
Example
<head>
<isindex prompt="Enter a search string:">
</head>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
Element-Specific Event Handler Attributes
None.
prompt | NN all IE all HTML 4 |
This attribute lets you assign the prompt message that appears with
the element.
Example
<isindex prompt="Enter a search string:">
Value
Any quoted string.
Default
None.
<kbd> | NN all IE all HTML all |
<kbd>...</kbd> | HTML End Tag: Required | The kbd element is one of a large group of
elements that the HTML 4 recommendation calls phrase
elements. Such elements assign structural meaning to a
designated portion of the document. A kbd element
is one that displays text that a user is supposed to type on the
keyboard, presumably to fill a text field or issue some command.
Browsers have free rein to determine how (or whether) to distinguish
kbd element content from the rest of the
body element. Both Navigator and Internet Explorer
elect to use a monospace font for the text. Override the default with
a style sheet as you see fit.
Example
<p>If you don't know the answer, type <kbd>NONE</kbd> into the text box.</p>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<keygen> | NN all IE n/a HTML n/a |
<keygen> | HTML End Tag: Forbidden | A keygen element allows a form to be submitted
with key encryption, where the server expects a form to be packaged
with an encrypted key. The client browser must have a digital
certificate installed. The user sees two results of including the
keygen element inside a form
element. First, a select list of available encryption key sizes is
rendered in the form where the keygen element
appears. When the user submits the form, the user may see one or more
security-related dialogs for confirmation. This element builds on the
public-key encryption systems in Navigator and
Netscape's Certificate Management System (CMS).
Documentation is available at developer.netscape.com/docs/manuals/cms/41/dep-guide/contents.htm.
Example
<form ...>
...
<keygen name="encryptedOrder" challenge="39457582201">
</form>
Element-Specific Attributes
challenge
|
keytype
|
name
|
pqg
|
Element-Specific Event Handler Attributes
None.
challenge | NN all IE n/a HTML n/a |
challenge="challengeString" | Required | If the server is equipped to interpret a challenge string for
verification of an encrypted package, the
challenge attribute is the challenge string. If
you assign an empty string to the attribute, the key is encoded as an
IA5STRING.
Example
<keygen name="encryptedOrder" challenge="39457582201">
Value
Any string.
Default
Empty string.
keytype | NN all IE n/a HTML n/a |
keytype="keyType" | Optional/Required | Sets the type of key to be created by the CMS prior to submitting the
form data. This attribute is required only for the secondary type,
DSA.
Example
<keygen name="encryptedOrder" challenge="39457582201" keytype="DSA">
Value
One of two constant values: RSA |
DSA.
Default
RSA
name | NN all IE n/a HTML n/a |
name="identifier" | Required | Encrypting a form turns the entire form into a value that is part of
a name/value pair. The name attribute assigns the
"name" part of the name/value pair.
If the server successfully decrypts the package, the individual form
element name/value pairs are available to the server for further
processing.
Example
<keygen name="encryptedOrder" challenge="39457582201">
Value
Case-insensitive identifier.
Default
None.
pqg | NN all IE n/a HTML n/a |
pqg="dssParams" | Optional/Required | If you specify the DSA key type for the keytype
attribute, you must also assign associated parameter values to the
pqg attribute. An explanation of the algorithms
used to derive these values may be found at ftp://ftp.ietf.org/internet-drafts/draft-ietf-pkix-ipki-pkalgs-05.txt.
<label>...</label> | HTML End Tag: Required | The label element defines a structure and
container for the label associated with an input
element. Because the rendered labels for most form controls are not
part of the element's tag, the
label attribute provides a way for an author to
associate the context of the label with its control. A
label element also simplifies assigning uniform
styles to all form labels.
You have two ways to provide the association. One is to assign the
id attribute value of the control to the
for attribute of the label
element. The other is to wrap the input element
inside a label element. The latter is possible
only if the label and control are part of running body content; if
you must physically separate the label from the control because they
exist inside separate td elements of a table, you
must use the for attribute linkage. Whether the
label is rendered in front of or after the control depends entirely
on the relative locations of the tags in the source code.
Example
<form>
<label>Company:<input type="text" name="company"></label><br>
<label for="stateEntry">State:</label>
<input type="text" name="state" id="stateEntry">
...
</form>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
accesskey
|
datafld
|
dataformatas
|
datasrc
|
for
|
Element-Specific Event Handler Attributes
None.
accesskey | NN 6 IE 4 HTML 4 |
accesskey="character" | Optional | A single character key that brings focus to, or activates, the
associated input element. See the description of
this shared attribute at the beginning of this chapter for general
characteristics.
Example
<label for="stateEntry" accesskey="s">State:</label>
Value
Single character of the document set.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).accessKey
datafld | NN n/a IE 4 HTML n/a |
datafld="columnName" | Optional | Used with IE data binding to associate a remote data source column
name with the label of an input element. The data
source column must be either plain text or HTML (see
dataformatas). A datasrc
attribute must also be set for the label element.
Works only with text file data sources in IE 5/Mac.
Example
<label for="stateEntry" datasrc="DBSRC3" datafld="label" dataformatas="HTML">
</label>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).dataFld
dataformatas | NN n/a IE 4 HTML n/a |
dataformatas="dataType" | Optional | Used with IE data binding, this attribute advises the browser whether
the source material arriving from the data source is to be treated as
plain text or as tagged HTML. This attribute setting depends entirely
on how the data source is constructed. Works only with text file data
sources in IE 5/Mac.
Example
<label for="stateEntry" datasrc="DBSRC3" datafld="label" dataformatas="HTML">
</label>
Value
IE recognizes two possible settings: text |
html.
Default
text
Object Model Reference
[window.]document.getElementById(elementID).dataFormatAs
datasrc | NN n/a IE 4 HTML n/a |
datasrc="dataSourceName" | Optional | Used with IE data binding to specify the ID of the
page's object element that loads
the data source object for remote data access. Content from the data
source is specified via the datafld attribute.
Works only with text file data sources in IE 5/Mac.
Example
<label for="stateEntry" datasrc="DBSRC3" datafld="label" dataformatas="HTML">
</label>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).dataSrc
for="inputElementIdentifier" | Optional | A unique identifier that is also assigned to the
id attribute of the input
element to which the label is to be associated. The
for attribute is necessary only when you elect not
to wrap the input element inside the
label element, in which case the
for attribute performs the binding between the two
elements.
Example
<label for="stateEntry">State:</label>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).htmlFor
<layer> | NN |4| IE n/a HTML n/a |
<layer>...</layer> | HTML End Tag: Required | A layer element is a positionable element in
Navigator 4's object model (e.g., like a block-level
element whose CSS position attribute is set to
absolute). As a result, many of the attributes are
named according to the Navigator 4 way of positioning, sizing, and
stacking positionable elements. The element was removed from the
Netscape DOM for Version 6, and will not be implemented in new
browsers or W3C standards.
Content for a layer element can be read from a
separate file (with the src attribute) or wired
into the current document by placing the HTML between the start and
end tags. You can include both types of content in the same
layer element. Content from the
src document is rendered first (as its own
block-level element), with additional content starting on its own
line below the external content's rectangle.
A layer element can be positioned anywhere within
a document and can overlap content belonging to other layers
(including the base document layer). Under link or script control,
content for an individual layer can be changed without having to
reload the other content on the page. Moreover,
layer elements may be nested inside one another.
Example
<layer bgcolor="yellow" src="instrux.html" width="200" height="300"></layer>
Object Model Reference
[window.]document.layerName
Element-Specific Attributes
above
|
background
|
below
|
bgcolor
|
clip
|
height
|
id
|
left
|
pagex
|
pagey
|
src
|
top
|
visibility
|
width
|
z-index
|
Element-Specific Event Handler Attributes
Handler
|
NN
|
IE
|
HTML
|
onblur
|
4
|
n/a
|
n/a
|
onfocus
|
4
|
n/a
|
n/a
|
onload
|
4[11]
|
n/a
|
n/a
|
onmousedown
|
4a
|
n/a
|
n/a
|
onmouseout
|
4a
|
n/a
|
n/a
|
onmouseover
|
4a
|
n/a
|
n/a
|
onmouseup
|
4a
|
n/a
|
n/a
|
[11]Event capture mode only.
above | NN |4| IE n/a HTML n/a |
Names the positionable element that is to be above (in front of) the
current layer in the stacking order. This is a
different way to set the z-index attribute that
does not rely on an arbitrary numbering system. If you use the
above attribute, do not use the
below or z-index attribute for
the same layer element.
Example
<layer id="instrux" bgcolor="yellow" src="instrux.html" above="help1"
width="200" height="300">
</layer>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.layerName.above
background | NN |4| IE n/a HTML n/a |
Specifies an image file that is used as a backdrop to the text and
other content of the layer element. Unlike normal
images that get loaded into browser content, a background image loads
in its original size (without scaling) and tiles to fill the
available layer space. Smaller images download faster but are
obviously repeated more often in the background. Animated GIFs are
also allowable but very distracting to the reader. When selecting a
background image, be sure it is very muted in comparison to the main
content so that the content stands out clearly. Background images, if
used at all, should be extremely subtle.
Example
<layer background="blueCrinkle.jpg" src="instrux.html" width="200" height="300">
</layer>
Value
Any valid URL to an image file, including complete and relative URLs.
Default
None.
Object Model Reference
[window.]document.layerName.background
below | NN |4| IE n/a HTML n/a |
Names the positionable element that is to be below (behind) the
current layer in the stacking order. This is a
different way to set the z-index attribute that
does not rely on an arbitrary numbering system. If you use the
below attribute, do not use the
above or z-index attribute for
the same layer element.
Example
<layer bgcolor="yellow" src="instrux.html" width="200" height="300" below="thankyou">
</layer>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.layerName.below
bgcolor | NN |4| IE n/a HTML n/a |
bgcolor="colorTripletOrName" | Optional | Establishes a fill color (behind the text and other content) for the
entire layer rectangle. If you combine a bgcolor
and background, any transparent areas of the
background image let the background color show through.
Example
<layer bgcolor="yellow" src="instrux.html" width="200" height="300"></layer>
Value
A hexadecimal triplet or plain-language color name. A setting of
empty is interpreted as "#000000" (black). See
Appendix A for acceptable plain-language color
names.
Default
Varies with operating system.
Object Model Reference
[window.]document.layerName.bgColor
clip | NN |4| IE n/a HTML n/a |
clip="[leftPixel,
topPixel,]rightPixel,bottomPixel" A clipping region is a rectangular view to the full
layer content. Only content that is within the
clipping rectangle can be seen on the page. The default value of the
clip attribute is either the default size of the
content or the layer element's
width by the automatically flowing content length. Setting the
clip attribute lets you rein in long content that
might flow beyond a fixed rectangle desired for the page design.
Example
<layer bgcolor="yellow" src="instrux.html" clip="50,50" width="200" height="300">
</layer>
Value
clip attribute values are pixel measures from the
top and left edges of the element as it flows in the document. The
order of values is clockwise from the left edge, around the rectangle
sides: left, top, right, bottom. If you supply only two values,
Navigator 4 assumes the left and top values are zero, meaning that
you wish to adjust only the right and bottom edges. Thus, a setting
of "50,50" means that the clipping region is 50
pixels square, starting at the top-left corner of the
layer's rectangle. If you want the same size view
starting 10 pixels in from the left, the clip
attribute setting becomes "10,0,60,50".
Default
Naturally flowing viewing area of layer content.
Object Model Reference
[window.]document.layerName.clip.left
[window.]document.layerName.clip.top
[window.]document.layerName.clip.right
[window.]document.layerName.clip.bottom
height, width | NN |4| IE n/a HTML n/a |
height="length"
width="length" Define the minimum size of the layer element. When
you add content to the layer during initial loading, however, the
attribute settings do not restrict the amount of the content that is
visible along either axis. For example, if you display an image in a
layer that is 120 pixels wide by 90 pixels high,
the actual visible size of a layer element whose
height and width attributes are
set to a smaller size expands to allow the full image to appear. The
same happens to text or other content: the viewable region expands to
allow all content to appear. To restrict the visible portion of the
content, set the clip attribute.
Setting the height and width
attributes to specific sizes is helpful when you are creating a
colored or patterned rectangle (via the bgcolor or
background attributes) to act as an underlying
layer beneath some other positioned content. Without content pushing
on the edges of the layer, the
height and width attributes set
the clipping region to their sizes.
Example
<layer bgcolor="yellow" src="instrux.html" width="200" height="300"></layer>
Value
Positive integer values or percentage values. You can reduce both
values to zero to not only hide the element (which you can also do
with the visibility attribute), but also prevent
the element from occupying any page space.
Default
Naturally flowing viewing area of layer content.
Object Model Reference
[window.]document.layerName.height
[window.]document.layerName.width
id="elementIdentifier" | Optional | A unique identifier that distinguishes this element from all the rest
in the document. This is the identifier used as values for the
above and below attributes.
Scripts also use the id attribute value as the
layer element's name for object
references.
Example
<layer id="oldYeller" bgcolor="yellow" src="instrux.html" width="200" height="300">
</layer>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.layerName.name
left, top | NN |4| IE n/a HTML n/a |
left="pixelCount"
top="pixelCount" Define the positioned offset of the left and top edges of the layer
relative to the spot in the document where the
layer element would normally appear in source code
order. This precise location relative to the page varies unless you
also set the pagex and pagey
attributes, which absolutely position the element in the document
space. Unlike what it does for the ilayer element,
Navigator does not preserve the space in the document where a
layer element appears. The element is placed in
its own plane, and the surrounding source code content is cinched
up—usually overlapping the layer content
unless the layer is positioned elsewhere.
Example
<layer bgcolor="yellow" src="instrux.html" width="200" height="300" left="10" top="50">
</layer>
Value
Positive integer values (optionally quoted).
Default
0
Object Model Reference
[window.]document.layerName.left
[window.]document.layerName.top
pagex, pagey | NN |4| IE n/a HTML n/a |
pagex="pixelCount"
pagey="pixelCount" To truly position a layer element with repeatable
accuracy, you can use the top-left corner of the document (page) as
the point of reference. When you set the pagex
and/or pagey attributes, you establish an offset
for the left and top edges of the layer element
relative to the corresponding edges of the entire document.
Therefore, the zero point for a vertically scrolled page may be above
the visible area of the browser window.
Example
<layer bgcolor="yellow" src="instrux.html" width="200" height="300" pagex="50"
pagey="350">
</layer>
Value
Positive integer values (optionally quoted).
Default
0
Object Model Reference
[window.]document.layerName.pageX
[window.]document.layerName.pageY
src | NN |4| IE n/a HTML n/a |
To load the content of an external HTML file into a
layer element, assign the URL of that file to the
src attribute. Any HTML content between the
layer start and end tags is rendered on the page
after the content is loaded from the src URL. If
you omit the src attribute, only content between
the tags is rendered. Scripts can change the corresponding object
property (src) after the document has loaded to
dynamically change content within the layer
element (without reloading the main document).
Example
<layer bgcolor="yellow" src="instrux.html" width="200" height="300"></layer>
Value
A complete or relative URL.
Default
None.
Object Model Reference
[window.]document.layerName.src
See left.
visibility | NN |4| IE n/a HTML n/a |
visibility="visibilityConstant" | Optional | Determines whether Navigator 4 displays the layer
element. The default behavior is for a layer to inherit the
visibility attribute of its next outermost
(parent) layer. For a layer element that is part
of the basic document body, this means that the layer is seen by
default (the base layer is always visible). To hide a layer when the
page loads, set the visibility attribute to
"hidden". You need to set the attribute to
"show" only if the layer
element is nested within another layer (or
ilayer) whose visibility value
is set to (or is inherited as) "hidden".
Example
<layer bgcolor="yellow" src="instrux.html" width="200" height="300"
pagex="50" pagey="350" visibility="hidden">
</layer>
Value
One of the accepted constants: hidden |
inherit | visible.
Default
inherit
Object Model Reference
[window.]document.layerName.visibility
See height.
z-index | NN |4| IE n/a HTML n/a |
z-index="layerNumber" | Optional | Controls the positioning of layers along the Z-axis (front-to-back)
of the document relative to the next outermost layer container. When
the z-index values of two or more positionable
elements within the same container (such as the base document layer)
are identical numbers, the loading order of the elements in the HTML
source code controls the stacking order, with the later elements
stacked in front of earlier ones. The default
z-index value for all positionable elements is
zero. Therefore, if you want only one positionable element to appear
in front of all the others that stack in their default order, you
simply assign any positive value (even 1) to that
standout element. Stacking order of positionable elements can be
changed on-the-fly via scripting. See also the
above and below attributes.
Example
<layer bgcolor="yellow" src="instrux.html" width="200" height="300" z-index="1">
</layer>
Value
Any integer.
Default
0
Object Model Reference
[window.]document.layerName.zIndex
<legend>...</legend> | HTML End Tag: Required | The legend element acts as a label for a
fieldset element. In visual browsers, this usually
means that the label is visually associated with the group border
rendered for the fieldset element. A
text-to-speech browser might read the label aloud as a user navigates
through a form. Place the legend element
immediately after the start tag of the fieldset
element for the association to stick. Because the content of the
legend element is HTML content, you can assign
styles to make the label stand out, if you like.
Example
<form method="POST" action="...">
<fieldset>
<legend>Credit Card Information</legend>
...inputElementsHere...
</fieldset>
</form>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
Element-Specific Event Handler Attributes
None.
accesskey | NN 6 IE 5 HTML 4 |
accesskey="character" | Optional | A single character key that brings focus to, or activates, the first
focusable control of the form associated with the
legend element. See the description of this shared
attribute at the beginning of this chapter for general
characteristics.
Example
<legend accesskey="c">Credit Card Information</legend>
Value
Single character of the document set.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).accessKey
Controls the alignment of the legend element with
respect to the containing fieldset element. See
the discussion about text alignment inside a containing box in the
Section 8.1.5,
earlier in this chapter.
Example
<legend align="right">Credit Card Information</legend>
Value
Allowed values in HTML 4 are bottom |
left | right |
top. IE 4 and later and Netscape 6 add
center.
Default
left
Object Model Reference
[window.]document.getElementById(elementID).align
<li> | NN all IE all HTML all |
<li>...</li> | HTML End Tag: Optional | The li element is a single list item that is
nested inside an ol or ul list
container. The outer container determines whether the
li item is preceded with a number or letter
(indicating sequence within an order) or a symbol that
doesn't connote any particular order. A special
category of style sheet attributes are devoted to list formatting.
If you apply a style sheet rule to an li element
to adjust the color in Navigator 4, only the leading symbol is
colored. To color the text as well, wrap the li
element inside a span element and apply the style
to the span element. This workaround operates fine
in other CSS-capable browsers.
Example
<ul>
<li>Larry</li>
<li>Moe</li>
<li>Curly</li>
</ul>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
Element-Specific Event Handler Attributes
None.
type | NN all IE all HTML 3.2 |
The type attribute provides some flexibility in
how the browser displays the item's leading symbol
or sequence number. Values are divided into two groups, with one
group each dedicated to ol and
ul items. For an unordered list
(ul), you can specify whether the leading symbol
should be a disc, circle, or square; for an ordered list
(ol), the choices are among letters (uppercase or
lowercase), Roman numerals (uppercase or lowercase), or Arabic
numerals. The type attribute is deprecated in HTML
4 in favor of the list-style-type style sheet
attribute.
Be aware that in Version 4 browsers, the type
attribute for a li element sets the type for
subsequent li elements in the list unless
overridden by a type attribute setting in another
li element. More recent versions restrict the
effect to the current li element. In general,
though, it is best to set the type attribute of
the ol or ul element and let
that setting govern all nested elements.
Example
<li type="square">Chicken Curry</li>
Value
When contained by a ul element, possible values
are disc | circle |
square. When contained by an ol
element, possible values are A |
a | I | i |
1. Sequencing is performed automatically as shown
in the following table.
Type
|
Example
|
A
|
A, B, C, ...
|
a
|
a, b, c, ...
|
I
|
I, II, III, ...
|
i
|
i, ii, iii, ...
|
1
|
1, 2, 3, ...
|
Default
1 and disc.
Object Model Reference
[window.]document.getElementById(elementID).type
value | NN all IE all HTML 3.2 |
The value attribute applies only when the
li element is nested inside an
ol element. You can manually set the number used
as a starting point for the sequencing of ordered list items. This
can come in handy when you need to break up an ol
element with some running text that is not part of the list.
Even though the value assigned to this attribute is a number, it does
not affect the type setting. For example, setting
value to 3 when
type is A means that the
sequence starts from that li element with the
letter C.
Example
<li value="3">Insert Tab C into Slot M. Tighten with a wingnut.</li>
Value
Any positive integer.
Default
1
Object Model Reference
[window.]document.getElementById(elementID).value
<link> | HTML End Tag: Forbidden | Unlike the a element (informally called a link
when it contains an href attribute), the
link element belongs inside the
head element and is a place for the document to
establish links with external documents, such as style sheet
definition files or font definition files. By and large, browsers
have yet to exploit the intended powers of this element. A variety of
attributes let the author establish relationships between the current
document and potentially related documents. In theory, some of these
relationships could be rendered as part of the document or browser
controls. Implementations of this element as of Version 6 of
Navigator and Internet Explorer are rather weak compared to the HTML
4 specification. At the same time, several attributes (and all event
handlers) defined in the HTML 4 specification and listed among shared
items at the beginning of this chapter aren't very
helpful because they more typically apply to elements that actually
display content on the page. No explicit document content is rendered
as a result of the link element. Some of those
attributes may be associated with the link element
by mistake or merely for consistency.
Example
<head>
<title>Section 3</title>
<link rev="Prev" href="sect2.html">
<link rel="Next" href="sect4.html">
<link rel="stylesheet" type="text/css" href="myStyles.css">
</head>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
charset
|
href
|
hreflang
|
media
|
rel
|
rev
|
src
|
target
|
type
|
|
Element-Specific Event Handler Attributes
None.
charset | NN 6 IE n/a HTML 4 |
charset="characterSet" | Optional | Character encoding of the content at the other end of the link.
Example
<link charset="csISO5427Cyrillic" href="moscow.html">
Value
Case-insensitive alias from the character set registry (ftp://ftp.isi.edu/in-notes/iana/assignments/character-sets).
Default
Determined by browser.
The URI of the document associated with the link (also known in W3C
jargon as the destination, even though there is
no page navigation involved). Navigator 4 uses the
src attribute for this purpose. Include both
attributes for a backward-compatible implementation.
Example
<link rel="Prev" href="sect2.html" src="sect2.html">
Value
Any valid URI, including complete and relative URLs.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).href
hreflang="languageCode" | Optional | The language code of the content at the destination of a link.
Requires that the href attribute also be set. This
attribute is primarily an advisory attribute to help a browser
prepare itself for a new language set if the browser is so enabled.
Example
<link hreflang="HI" href="hindi/Chap3.html">
Value
Case-insensitive language code.
Default
Browser default.
Object Model Reference
[window.]document.getElementById(elementID).hrefLang
media="descriptorList" | Optional | Sets the intended output device for the content of the destination
document pointed to by the href attribute. The
media attribute looks forward to the day when
browsers are able to tailor content to specific kinds of devices such
as pocket computers, text-to-speech digitizers, or fuzzy television
sets. The HTML 4 specification defines a number of constant values
for anticipated devices, but the list is open-ended, allowing future
browsers to tailor output to yet other kinds of media and devices.
Example
<link rel="Glossary" href="gloss.html" media="screen, tv, handheld">
Value
Constant values. Multiple values can be grouped together in a
comma-delimited list within a quoted string. Values defined in HTML 4
are all | aura |
braille | handheld |
print | projection |
screen | tty |
tv . IE 4 and later claims support for
all | print |
screen.
Default
screen
Object Model Reference
[window.]document.getElementById(elementID).media
Defines the relationship between the current element and the
destination of the link. The HTML 4 recommendation defines several
link types; it is up to the browser to determine how to employ the
value. The element must include an href attribute
for the rel attribute to be applied.
Example
<link rel="Next" href="sect6.html">
Value
Case-insensitive, space-delimited list of standard link types
applicable to the document and browser. HTML 4-sanctioned link types
are:
alternate
|
appendix
|
bookmark
|
chapter
|
contents
|
copyright
|
glossary
|
help
|
index
|
next
|
prev
|
section
|
start
|
stylesheet
|
subsection
|
|
IE 4 and later and Navigator 4 and later use
stylesheet to link in an external CSS file.
Navigator 4 recognizes stylesheet and
fontdef. In IE 5 and later for Windows, you can
also use the value shortcut icon (with the space)
and assign a URL to a custom icon file (.ico) on
your server so that your icon appears in the Favorites list if the
user chooses to add the page to his list.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).rel
A reverse link relationship. Like the rel
attribute, the rev attribute's
capabilities are defined by the browser, particularly with regard to
how the browser interprets and renders the various link types
available in the HTML 4 specification. Given two documents (A and b)
containing links that point to each other, the rev
value of b is designed to express the same relationship between the
two documents as denoted by the rel attribute in
A. Version 6 browsers provide no practical functionality for this
attribute.
Example
<link rev="Prev" href="sect4.html">
Value
Case-insensitive, space-delimited list of HTML 4 standard link types
applicable to the element. See the rel attribute
for sanctioned link types.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).rev
The URL of the destination of a link. Internet Explorer 4 and later,
Netscape 6, and HTML 4 use the href attribute for
this purpose. Include both attributes for a cross-browser
implementation.
Example
<link rel="fontdef" src="fonts/garamond.pfr" href="fonts/garamond.pfr">
Value
Any valid URL, including complete and relative URLs.
Default
None.
target="windowOrFrameName" | Optional | Presumably, the target attribute is provided in
HTML 4 as a way to specify the destination for the display of a
document at the other end of the href attribute of
the link element.
Value
Identifier when the frame or window name has been assigned via the
target element's name attribute.
Four reserved target names act as constants:
- _blank
-
Browser creates a new window for the destination document.
- _parent
-
Destination document replaces the current frame's
framesetting document (if one exists; otherwise, it is treated as
_self).
- _self
-
Destination document replaces the current document in its window or
frame.
- _top
-
Destination document is to occupy the entire browser window,
replacing any and all framesets that may be loaded (also treated as
_self if there are no framesets defined in the
window).
IE for Windows implements two other values:
_search (IE 5 and later) and
_media (IE 6). These supposedly direct the browser
to load linked content into the browser's Search
pane and Media Bars, respectively. Precise implementation details are
not yet clear.
Default
_self
Object Model Reference
[window.]document.getElementById(elementID).target
An advisory about the content type of the destination document or
resource. In practice, this attribute has been used so far to prepare
the browser for the style sheet type being linked to.
Example
<link rel="stylesheet" type="text/css" href="styles/mainStyle.html">
Value
Case-insensitive MIME type. A catalog of registered MIME types is
available from ftp://ftp.isi.edu/in-notes/iana/assignments/media-types/.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).type
<listing> | NN all IE all HTML <4 |
<listing>...</listing> | HTML End Tag: Required | The listing element displays its content in a
monospace font as a block element, as in computer code listings
rendered 132 columns wide. In most browsers, the font size is also
reduced from the default size. Browsers observe carriage returns and
other whitespace in element content. This element has been long
deprecated in HTML and has even been removed from the HTML 4.0
specification. You are encouraged to use the pre
element instead.
Example
<listing>
<script language="JavaScript">
document.write("Hello, world.")
</script>
</listing>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None
<map> | NN all IE all HTML 3.2 |
<map>...</map> | HTML End Tag: Required | A map element is a container for
area elements that define the location and links
of hotspots of client-side image maps. The primary purpose of the
map element is to associate an identifier (the
name attribute) that the usemap
attribute points to when turning an img element
into a client-side image map. Most other attributes are style-related
and may be applied to the map element so that they
are inherited by elements nested within.
Example
<img src="images/logo.gif" alt="Scroll to the bottom for navigation links."
height="300" width="250" usemap="#navigation">
<map name="navigation">
<area shape="rect" coords="0,0,100,100" href="products.html">
<area shape="rect" coords="0,100,300,100" href="support.html">
</map>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
Element-Specific Event Handler Attributes
None.
name | NN all IE all HTML 3.2 |
name="identifier" | Required | The identifier to which the usemap attribute of an
img element points. Because the
usemap attribute is actually a URL type, its value
resembles that of a link to an anchor: the name is
preceded by a hash symbol (only in the usemap
attribute). Despite XHTML's preference for
id attributes over name
attributes, browsers continue to rely on the name
attribute as the connection between an image and an area map. Strict
HTML 4 and XHTML DTDs continue to validate the
name attribute.
Example
<map name="navigation"> ...</map>
Value
Case-sensitive unique identifier.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).name
<marquee> | NN n/a IE 3 HTML n/a |
<marquee>...</marquee> | HTML End Tag: Optional | The marquee element is unique to Internet
Explorer. It displays HTML content in a scrolling region on the page.
Scrolled content goes between the start and end tags. There is no
corresponding element in Navigator, although the effect can be
duplicated in a cross-browser fashion with a Java applet or more
cumbersomely through Dynamic HTML.
Example
<marquee behavior="slide" direction="left" width="250" bgcolor="white">
Check out our monthly specials.
</marquee>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
behavior
|
bgcolor
|
datafld
|
dataformatas
|
datasrc
|
direction
|
height
|
hspace
|
loop
|
scrollamount
|
scrolldelay
|
truespeed
|
vspace
|
width
|
|
Element-Specific Event Handler Attributes
Handler
|
NN
|
IE
|
HTML
|
onafterupdate
|
n/a
|
4
|
n/a
|
onbounce
|
n/a
|
4
|
n/a
|
onfinish
|
n/a
|
4
|
n/a
|
onstart
|
n/a
|
4
|
n/a
|
behavior | NN n/a IE 3 HTML n/a |
behavior="motionType" | Optional | Sets the motion of the content within the rectangular space reserved
for the marquee element. You have a choice of
three motion types.
Example
<marquee behavior="slide" direction="left" width="250" bgcolor="white">
...</marquee>
Value
One of the case-insensitive marquee element motion types:
- alternate
-
Content alternates between marching left and right.
- scroll
-
Content scrolls (according to the direction
attribute) into view and out of view before starting again.
- slide
-
Content scrolls (according to the direction
attribute) into view, stops at the end of its run, blanks, and then
starts again.
Default
scroll
Object Model Reference
[window.]document.getElementById(elementID).behavior
bgcolor | NN n/a IE 3 HTML n/a |
bgcolor="colorTripletOrName" | Optional | Establishes a fill color (behind the text and other content) for the
rectangular space reserved for the marquee
element.
Example
<marquee behavior="slide" direction="left" width="250" bgcolor="white">
...</marquee>
Value
A hexadecimal triplet or plain-language color name. A setting of
empty is interpreted as "#000000" (black). See
Appendix A for acceptable plain-language color
names.
Default
Varies with browser, browser version, and operating system.
Object Model Reference
[window.]document.getElementById(elementID).bgColor
datafld | NN n/a IE 4 HTML n/a |
datafld="columnName" | Optional | Used with IE data binding to associate a remote data source column
name with the content scrolled by the marquee
element. The data source column must be either plain text or HTML
(see dataformatas). A datasrc
attribute must also be set for the marquee
element. Works only with text file data sources in IE 5/Mac.
Example
<marquee behavior="slide" direction="left" width="200"
datasrc="DBSRC3" datafld="news" dataformatas="HTML"></marquee>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
IE
dataformatas | NN n/a IE 4 HTML n/a |
dataformatas="dataType" | Optional | Used with IE data binding, this attribute advises the browser whether
the source material arriving from the data source is to be treated as
plain text or as tagged HTML. This attribute setting depends entirely
on how the data source is constructed. Works only with text file data
sources in IE 5/Mac.
Example
<marquee behavior="slide" direction="left" width=200
datasrc="DBSRC3" datafld="news" dataformatas="HTML"></marquee>
Value
Constant values: text | html.
Default
text
Object Model Reference
[window.]document.getElementById(elementID).dataFormatAs
datasrc | NN n/a IE 4 HTML n/a |
datasrc="dataSourceName" | Optional | Used with IE data binding, this attribute advises the browser whether
the source material arriving from the data source is to be treated as
plain text or as tagged HTML. Works only with text file data sources
in IE 5/Mac.
Example
<marquee behavior="slide" direction="left" width="200"
datasrc="DBSRC3" datafld="news" dataformatas="HTML"></marquee>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).dataSrc
direction | NN n/a IE 3 HTML n/a |
direction="scrollDirection" | Optional | A marquee element's content may
scroll in one of four directions. For optimum readability in
languages written left to right, it is easier to grasp the content
when it scrolls either to the left or downward.
Example
<marquee behavior="slide" direction="left" width="200">...</marquee>
Value
Four possible directions: down |
left | right |
up.
Default
left
Object Model Reference
[window.]document.getElementById(elementID).direction
height, width | NN n/a IE 3 HTML n/a |
height="length"
width="length" A marquee element renders itself as a rectangular
space on the page. You can override the default size of this
rectangle by assigning values to the height and
width attributes. The default value for
height is determined by the font size of the
largest font assigned to content in the marquee.
Default width is set to 100% of the width of the next outermost
container (usually the document body). The
width defines how much space is used at one time
or another by horizontally scrolling content. When the
marquee is embedded within a td
element that lets the browser determine the table
cell's calculated width, you must set the
width of the marquee element or
risk having the browser set it to 1, making the content unreadable.
If you want extra padding around the space, see the
hspace and vspace attributes.
Example
<marquee behavior="slide" direction="left" height="20" width="200">
...
</marquee>
Value
Any length value in pixels or percentage of available space.
Default
A width of 100%; a height of 12
pixels.
Object Model Reference
[window.]document.getElementById(elementID).height
[window.]document.getElementById(elementID).width
hspace, vspace | NN n/a IE 3 HTML n/a |
hspace="pixelCount"
vspace="pixelCount" Internet Explorer provides attributes for setting padding around a
marquee element. The hspace
attribute controls padding along the left and right edges (horizontal
padding), whereas the vspace attribute controls
padding along the top and bottom edges (vertical padding). Adding
such padding provides an empty cushion around the
marquee's rectangle. As an alternative, you can
specify the various margin style sheet settings, especially if you
want to open space along only one edge.
Example
<marquee behavior="slide" direction="left" height="20" width="200"
hspace="10" vspace="15">...</marquee>
Value
Any positive integer.
Default
0
Object Model Reference
[window.]document.getElementById(elementID).hspace
[window.]document.getElementById(elementID).vspace
Sets the number of times the marquee element
scrolls its content. After the final scroll, the content remains in a
fixed position. Constant animation can sometimes be distracting to
page visitors, so if you have the marquee turn
itself off after a few scrolls, you may be doing your visitors a
favor.
Example
<marquee behavior="slide" direction="left" height="20" width="200" loop="3">
...</marquee>
Value
Any positive integer if you want the scrolling to stop. Otherwise,
set the value to -1 or
infinite.
Default
-1
Object Model Reference
[window.]document.getElementById(elementID).loop
scrollamount | NN n/a IE 3 HTML n/a |
scrollamount="pixelCount" | Optional | marquee content looks animated by virtue of the
browser clearing and redrawing its content at a location offset from
the previous location (in a direction set by the
direction attribute). You can make the scrolling
appear faster by increasing the amount of space between positions of
each drawing of the content; conversely, you can slow down the
scrolling by decreasing the space. See also
scrolldelay.
Example
<marquee behavior="slide" direction="left" height="20" width="200" scrollamount="2">
...</marquee>
Value
Any positive integer.
Default
6
Object Model Reference
[window.]document.getElementById(elementID).scrollAmount
scrolldelay | NN n/a IE 3 HTML n/a |
scrolldelay="milliseconds" | Optional | Apparent scrolling speed can be influenced by the frequency of the
redrawing of the content as its position shifts with each redraw (see
scrollamount). Increasing the
scrolldelay value slows down the scroll speed,
whereas decreasing the value makes the scrolling go faster. Be aware
that on slower computers, you can reach a value at which no increase
of speed is discernible no matter how small you make the
scrolldelay value (see
truespeed).
Example
<marquee behavior="slide" direction="left" height="20" width="200" scrolldelay="100">
...</marquee>
Value
Any positive integer representing the number of milliseconds between
content redraws.
Default
85 (Windows 95); 90 (Macintosh).
Object Model Reference
[window.]document.getElementById(elementID).scrollDelay
truespeed | NN n/a IE 4 HTML n/a |
The marquee element includes a built-in speed bump
to prevent scrolling from being accidentally specified as too fast
for visitors to read. If you genuinely intend the content to scroll
very fast, you can include the truespeed attribute
to tell the browser to honor scrolldelay settings
below 60 milliseconds.
Example
<marquee behavior="slide" direction="left" height="20" width="200"
scrolldelay="45" truespeed>...</marquee>
Value
The presence of this attribute sets the value to
true.
Default
false
Object Model Reference
[window.]document.getElementById(elementID).trueSpeed
See hspace.
See height.
<menu> | NN all IE all HTML all |
<menu>...</menu> | HTML End Tag: Required | The original idea of the menu element was to allow
browsers to generate single-column lists of items. Virtually every
browser, however, treats the menu element the same
as a ul element to present an unordered single
column list of items (usually preceded by bullets). The
menu element is deprecated in HTML 4. You should
be using the ul element for it in any case,
because you are assured backward compatibility and forward
compatibility should this element ever disappear from the browser
landscape. Everything said here also applies to the deprecated
dir element.
Example
Common DB Connector Types:
<menu>
<li>DB-9</li>
<li>DB-12</li>
<li>DB-25</li>
</menu>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
Element-Specific Event Handler Attributes
None.
compact | NN 6 IE 6 HTML 3.2 |
A Boolean attribute originally designed to let browsers render the
list in a more compact style than normal (smaller line spacing
between items).
Example
<menu compact>...</menu>
Value
The presence of this attribute makes its value
true.
Default
false
Object Model Reference
[window.]document.getElementById(elementID).compact
<meta> | NN all IE all HTML all |
<meta> | HTML End Tag: Forbidden | A meta element conveys hidden information about
the document. Some browsers respond to this element to derive header
information that may be important to the document but is not sent by
the server in response to the request for the document. The element
is also used to embed document information that some search engines
use for indexing and categorizing documents on the World Wide Web.
More than one meta element may be included in a
document, and all meta elements belong nested
inside the head element. The specific purpose of
each meta element is defined by its attributes.
Typically, a meta element reduces to a name/value
pair that is of use to either the server or the client. For example,
most browsers recognize attribute settings that force the page to
reload (or redirect to another page) after a timed delay. This would
be useful in a page whose content is updated minute-by-minute,
because the browser keeps reloading the latest page as often as
indicated in the meta element.
Several other elements and attributes in HTML 4 contain the same kind
of metadata that might otherwise be located in
meta elements. Use the avenue that is best suited
to your intended server and browser environments. See also the
address, del,
ins, link, and
title elements, as well as the
profile attribute of the head
element.
Much mythology surrounds meta element usage. Some
attribute values affect only some browsers (controlling the browser
cache, for example), and not all search engine bots respond to
meta tag attribute values the same way (if at
all). At the same time, commonly-used powers, such as
refresh, are frowned upon by the standards. There
are no mandated standards for acceptable values, but the W3C
validators for HTML 4 and XHTML point toward acceptance of the
character set value shown in the example below.
Example
<head profile="http://www.giantco.com/profiles/common">
<meta name="Author" content="Jane Smith">
<meta name="keywords" content="benefits,insurance,plan">
<meta http-equiv="refresh"
content="1;URL=http://www.giantco.com/truindex.html">
<meta http-equiv="Content-Type" content="text/html;
charset=ISO-8859-5">
</head>
Element-Specific Attributes
content
|
http-equiv
|
name
|
scheme
|
Element-Specific Event Handler Attributes
None.
content | NN all IE all HTML all |
content="valueString" | Required | The equivalent of the value of a name/value pair. The attribute is
usually accompanied by either a name or
http-equiv attribute, either of which act as the
name portion of the name/value pair. Specific values of the
content attribute vary with the value of the
name or http-equiv attribute.
Sometimes, the content attribute value contains
multiple values. In such cases, the values are delimited by commas,
semicolons, or whatever delimiter the browser expects for that
content. Some of these values may be name/value pairs in their own
right, such as the content for a refresh meta
element. The first value is a number representing the number of
seconds delay before loading another document; the second value
indicates a URL of the document to load after the delay expires.
Example
<meta http-equiv="refresh"
content="2;URL=http://www.giantco.com/basicindex.html">
Value
Any string of characters. The string must be inside a matching pair
of (single or double) quotation marks.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).content
http-equiv | NN all IE all HTML all |
http-equiv="identifier" | Optional | When a server sends a document to the client with the HTTP protocol,
a number of HTTP header fields are sent along, primarily as
directives to the client about the content on its way.
meta elements can add to those HTTP headers when
the http-equiv attribute is assigned to a
document. Browsers convert the http-equiv and
content attribute values into the HTTP response
header format of "name: value"
and treat them as if they came directly from the server.
Web standards define a long list of HTTP headers (see
Webmaster in a Nutshell by Stephen Spainhour and
Valerie Quercia, published by O'Reilly &
Associates), but some of the more common values are shown in the
following examples. Not all browsers respond to all header types, and
some browsers respond to browser-specific headers (e.g., the IE 6
MSTHEMECOMPATIBLE header). You can have either the
http-equiv or name attribute in
a meta element, but not both.
Example
<meta http-equiv="refresh"
content="1,http://www.giantco.com/truindex.html">
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-5">
<meta http-equiv="expires" content="Sun, 15 Jan 1998 17:38:00 GMT">
Value
Any string identifier.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).httpEquiv
name | NN all IE all HTML all |
name="identifier" | Optional | An identifier for the name/value pair that constitutes the
meta element. Typically, the attribute value is a
plain-language term that denotes the purpose of the
meta element, such as "author"
or "keywords". You can assign a value to either
the name or http-equiv
attribute, but not both, in the same meta element.
Example
<meta name="Author" content="Jane Smith">
<meta name="keywords" content="benefits,insurance,plan">
Value
Any string identifier.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).name
scheme="identifier" | Optional | Provides one more organizational layer to metadata supplied with a
document. For example, a university campus with several libraries
might generate documents associated with each of the libraries.
Assuming that a browser is equipped to interpret metadata about this,
one approach at assembling the tags is to create a separate
name attribute value for each library:
name="law", name="main",
name="engineering", and so on. But it may also be
necessary to associate these name values with a
specific university. The scheme attribute could be
called into service to align the metadata with a particular
university: scheme="Harvard". Now, other
university library systems could use the same organization of
name attributes, but the scheme
attribute clearly associates a given meta element
with a specific university and library. Again, this assumes that the
browser is empowered to do something special with this metaknowledge.
Example
<meta scheme="Chicago" name="classicalFM" content="98.7">
Value
Any string identifier.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).scheme
<multicol> | NN <6 IE n/a HTML n/a |
<multicol>...</multicol> | HTML End Tag: Required | A Navigator-specific (Versions 3 and 4) element that renders its
content in any number of evenly spaced flowing columns on the page.
The way this element flows content might remind you of a desktop
publishing program that automatically flows long content into column
space that has been defined for the page. There is no equivalent for
this element in HTML or Internet Explorer, but a CSS-related proposal
for a multicolumn layout attribute may find its way into CSS3. None
of these attributes are built into Version 6 browsers.
Example
<multicol cols="2" gutter="20" width="500">
LongFlowingHTMLContent
</multicol>
Element-Specific Attributes
Element-Specific Event Handler Attributes
None.
cols | NN <6 IE n/a HTML n/a |
cols="columnCount" | Required | Defines the number of columns across which the browser distributes
and renders the content of the element. For a given width of the
content, the browser does its best to make each column the same
length. The proposed CSS equivalent attribute is
column-number.
Example
<multicol cols="2" gutter="20" width="500">
LongFlowingHTMLContent
</multicol>
Value
Any positive integer.
Default
1
gutter | NN <6 IE n/a HTML n/a |
gutter="pixelCount" | Optional | Specifies the number of pixels to be placed between columns. The
browser then calculates the width of the content columns by
subtracting all the gutters from the total available width. The
proposed CSS equivalent attribute is column-gap.
Example
<multicol cols="2" gutter="20" width="500">
LongFlowingHTMLContent
</multicol>
Value
Any positive integer.
Default
10
width | NN <6 IE n/a HTML n/a |
width="elementWidth" | Optional | Defines the total width of the columns plus gutters. You can specify
the width in pixels or as a percentage of the width of the next outer
container (usually the document body). The
proposed CSS equivalent attribute is the existing
width attribute.
Example
<multicol cols="2" gutter="20" width="500">
LongFlowingHTMLContent
</multicol>
Value
Any length value in pixels or percentage of available space.
Default
100%
<nextid> | NN n/a IE all HTML <2 |
<nextid> | HTML End Tag: Prohibited | The nextid element was at one time intended to
assist document-editing application. It went inside a
document's head element.
Deprecated in HTML 2.0, it is no longer used.
<nobr> | NN all IE all HTML n/a |
<nobr>...</nobr> | HTML End Tag: Required | The nobr element instructs the browser to render
its content without wrapping the text to the next line at the right
edge of the window or container. Even if there are carriage returns
in the source code for the element's content, the
browser flows the text as one line. Although this might seem
convenient in circumstances involving careful layout of pages, it may
mean the user has to scroll horizontally to view the text—not
something most users like to do. Despite the longevity of the
nobr element in commercial browsers, it has never
been mentioned in formal HTML recommendations.
Example
<nobr>
Now is the time for all good men to
come to the aid of their country, even if
the text forces them to scroll horizontally.
</nobr>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<noembed> | NN 2 IE n/a HTML n/a |
<noembed>...</noembed> | HTML End Tag: Required | Navigator provides a tag for isolating advisory content that displays
in browsers incapable of working with plugins. All content between
the start and end tags of the noembed element is
not rendered in Navigator (or Internet Explorer) but is rendered in
other browsers (which ignore the tag but not the content). There are
no attributes for this element.
Example
<embed name="jukebox" src="jazz.aif" height="100" width="200"></embed>
<noembed>
To play the music associated with this page, you need a modern graphical browser.
</noembed>
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<noframes> | NN 2 IE 3 HTML 4 |
<noframes>...</noframes> | HTML End Tag: Required | The noframes element contains HTML that is
rendered by browsers incapable of displaying frames. Browsers that
are capable of displaying frames ignore the
noframes element and all content it contains.
Content for this element should instruct the user about using frames
or perhaps offer a link to a frameless version of the page. The most
common location for the noframes element is inside
a frameset element. The HTML 4 specification,
however, sees nothing wrong with embedding the element in a rendered
document, if it makes sense for your application. It could be useful
if your page employs an iframe element, and you
want browsers not equipped for that element to alert users about what
they're missing.
All standard attributes of the noframes element
were added to support Cascading Style Sheets. This seems odd, because
it would seem very unlikely that a browser would support CSS but not
frames (with the exception of Navigator 4's lack of
iframe support).
Example
<frameset cols="150,*">
<frame name="navbar" src="nav.html">
<frame name="main" src="page1.html">
<noframes>Your browser does not support frames.
Click <a href="noFramesIndex.html">here</a> for a frameless version.
</noframes>
</frameset>
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<nolayer> | NN |4| IE n/a HTML n/a |
<nolayer>...</nolayer> | HTML End Tag: Required | Navigator 4 provides a tag for isolating advisory content that
displays in browsers that don't recognize the
layer element. All content between the start and
end tags of the nolayer element is not rendered in
Navigator 4 but is rendered in other browsers (which ignore the tag
but not the content). You can place the nolayer
element anywhere you want, but be aware that it
won't be positioned like the
layer element is intended to be. Netscape 6 (a
nonlayer browser) renders the nolayer
element's content.
There are no attributes for this element. If you attempt to set style
sheet rules for the nolayer element, they are
ignored by browsers such as Internet Explorer. You can, however, wrap
the nolayer element inside a
div or span element to
associate a style sheet rule with the advisory text.
Example
<layer bgcolor="yellow" src="instrux.html" width=200 height=300></layer>
<nolayer>
You are not seeing some content that requires Netscape Navigator 4 to view.
</nolayer>
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<noscript> | NN 3 IE 4 HTML 4 |
<noscript>...</noscript> | HTML End Tag: Required | The noscript element is intended to display
content when a browser is not set to run the scripts embedded in the
current document. In practice, the element is observed only starting
with Navigator 3 and Internet Explorer 4. When a user disables
scripting in a browser, the noscript
element's content is rendered wherever it falls in
the source code. For older browsers, and those that
don't support scripting, the
noscript element is ignored, which means that its
content is rendered within the next outermost
container's context. Going forward, the HTML 4.0
specification recommends that browsers also render the
noscript element's content when
scripts earlier in the document are of a language type not supported
or enabled in the browser. Also, if an HTML 4-compatible browser
should be developed that lacks scripting altogether, it, too, should
render the noscript element's
contents.
All standard attributes of the noscript element
were added to support Cascading Style Sheets, internationalization,
and events for HTML 4.
Example
<noscript>
This document contains programming that requires a scriptable browser, such
as Microsoft Internet Explorer or Netscape Navigator. You may not have full
access to this page's powers at this time.
</noscript>
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<object>...</object> | HTML End Tag: Required | The object element supplies the browser with
information to load and render data types that are not natively
supported by the browser. If the browser must load some external
program (a Java applet, a plugin, or some other helper), the
information about the content that is to be rendered is contained by
the object element, its attributes, and
optionally, associated param elements nested
inside of it. Although today's browsers recognize
elements such as applet and
embed, the HTML specification indicates that the
trend is to combine all of this into the object
element.
The HTML 4 specification allows nesting of object
elements to give the browser a chance to load alternate content if no
plugin or other necessary content aids are available in the browser.
Essentially, the browser should be able to walk through nested
object elements until it finds one it can handle.
For example, the outer object element may try to
load an MPEG2 video; if no player is available, the browser looks for
the next nested object, which is a JPEG still
image from the video; if the browser is not a graphical browser, it
would render some straight HTML that is the most nested item
(although not as an object element) within the
hierarchy of nested objects:
<div>
<object data="proddemo.mpeg" type="application/mpeg">
<object data="prodStill.jpg" type="image/jpeg">
The all-new Widget 3000!
</object>
</object>
</div>
To determine which attributes apply to a particular content type or
object and what their values look like, you have to rely on
documentation from the supplier of the object or plugin. That same
documentation should let you know whether the functionality is
available across browser brands and operating systems.
Example
<object id="earth" classid="clsid:83A38BF0-B33A-A4FF-C619A82E891D">
<param name="srcStart" value="images/earth0.gif">
<param name="frameCount" value="12">
<param name="loop" value="-1"
<param name="fps" value="10">
</object>
Element-Specific Attributes
align
|
alt
|
archive
|
border
|
classid
|
code
|
codebase
|
codetype
|
data
|
declare
|
height
|
hspace
|
name
|
standby
|
type
|
usemap
|
vspace
|
width
|
|
|
Element-Specific Event Handler Attributes
None.
align="alignmentConstant" | Optional | Determines how the rectangle of the object element
aligns within the context of surrounding content. See the discussion
about alignment of elements with respect to content outside an
element's box in the Section 8.1.5
earlier in this chapter.
Example
<object ... align="baseline"></object>
Value
Constant value. See Section 8.1.5.
Default
bottom
Object Model Reference
[window.]document.getElementById(elementID).align
archive="URIList" | Optional | A space-delimited list of URIs of files that support the loading and
running of the object element. By explicitly
specifying the files in the archive attribute, the
browser doesn't have to wait for the supporting
files to be called by the content running in the
object element. Instead, the supporting files can
be downloaded simultaneously with the primary content. The
archive attribute may also include URIs assigned
to the classid or data
attributes, but one of these two attributes still needs to point to
the primary content URI. Version 6 browsers provide no particular
functionality for this attribute.
Example
<object ... archive="/images/anim3.gif/images/anim4.gif"></object>
Value
A complete or relative URL.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).archive
The thickness of a border around the object
element. The attribute is deprecated in HTML 4 in favor of style
sheet borders. If you use the object element to
load an image for a client-side image map, you can set the
border attribute to zero to eliminate the typical
link border in IE 5/Mac and Netscape 6 (see usemap
later in this section).
Example
<object ... border="4"></object>
Value
Any integer pixel value.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).bprder
The URL of the object's implementation. This
attribute typically directs the browser to load a program, an applet,
or a plugin class file. In Internet Explorer, the URL can point to
the CLSID directory that stores all of the IDs
for registered ActiveX controls, such as DirectAnimation. You must
obtain the classid value from the supplier of an
ActiveX control (or root around the Registry with Regedit if you know what
you're looking for). In Navigator 4, the Java
Archive (JAR) Installation Manager attempts to install a plugin from
the classid URL if the plugin is not installed for
data specified in the data attribute. Eventually,
this attribute may be used to load Java applets (IE 4 includes a
code attribute to handle this now), but through
Version 6 of both browsers, Java applets are not yet supported in
this fashion.
Example
<object id="earth" classid="clsid:83A38BF0-B33A-A4FF-C619A82E891D"></object>
Value
A complete or relative URL.
Default
None.
Object Model Reference
[window.]document.elementID.classid
code="fileName.class" | Optional | Internet Explorer uses the code attribute to allow
the object element to perform the same job as an
applet element, using the same kind of attributes.
The code attribute value is the name of the Java
applet class file. If the class file is in a directory other than the
document, the path to the directory must be assigned to the
codebase attribute, just like in the
applet element. Parameters are passed to applets
via param elements, just like the ones nested
inside applet elements. IE appears to preserve the
classid attribute for referencing ActiveX controls
only.
Example
<object code="fileReader.class" codebase="classes"></object>
Value
Applet class filename.
Default
None.
Object Model Reference
[window.]document.elementID.code
Path to the directory holding the class file designated in either the
code or classid attribute. The
codebase attribute does not name the class file,
just the path. You can make this attribute a complete URL to the
directory, but don't try to access a codebase
outside of the domain of the current document.
Example
<object code="fileReader.class" codebase="classes"></object>
Value
Case-sensitive pathname, usually relative to the directory storing
the current HTML document.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).codeBase
codetype="MIMEType" | Optional | An advisory about the content type of the object referred to by the
classid attribute. A browser might use this
information to assist in preparing support for a resource requiring a
multimedia player or plugin. If the codetype
attribute is missing, the browser looks next for the
type attribute setting (although it is normally
associated with content linked by the data
attribute URL). If both attributes are missing, the browser gets the
content type information from the resource as it downloads.
Example
<object classid="clsid:83A38BF0-B33A-A4FF-C619A82E891D"
codetype="application/x-crossword"></object>
Value
Case-insensitive MIME type. A catalog of registered MIME types is
available from ftp://ftp.isi.edu/in-notes/iana/assignments/media-types/.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).codeType
URL of a file containing data for the object
element (as distinguished from the object itself). For data with a
content type that can be opened (and viewed or played) with any
compatible object or plugin, the data and
type attributes are generally sufficient to launch
the plugin and get the content loaded. But if the content requires a
very specific plugin or ActiveX control, you should include a
classid attribute that points to the
object's implementation as well. In that case, you
can specify the content type with either the
codetype or type attributes.
Relative URLs are calculated relative to the
codebase attribute, if one is assigned; otherwise
the URL is relative to the document's URL.
Example
<object data="proddemo.mpeg" type="application/mpeg"></object>
Value
A complete or relative URL.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).data
The presence of the declare attribute instructs
the browser to regard the current object element
as a declaration only, without instantiating the object. A browser
may use this opportunity to precache data that does not require the
object being loaded or run. Another object element
pointing to the same classid and/or
data attribute values, but without the
declare attribute, gets the object running.
Version 6 browsers provide no particular functionality for this
attribute.
Example
<object classid="clsid:83A38BF0-B33A-A4FF-C619A82E891D" declare></object>
Value
The presence of the attribute sets it to true.
Default
false
Object Model Reference
[window.]document.getElementById(elementID).declare
height, width | NN 4 IE 3 HTML 4 |
height="length"
width="length" The size that an embedded object (or its plugin control panel)
occupies in a document is governed by the height
and width attribute settings. Some browser
versions might allow you to get away without assigning these
attributes and letting the plugin's own user
interface design determine the height and width of its visible
rectangle. It is best to specify the exact dimensions of a
plugin's control panel or the data (in the case of
images) whenever possible (control panels vary with each browser and
even between different plugins for the same browser). In some cases,
such as Navigator 4 for the Macintosh, the object may not display if
you fail to supply enough height on the page. If you assign values
that are larger than the actual object or its control panel, the
browser reserves that empty space on the page, which could interfere
with your intended page design.
When an object is scriptable, and you don't want its
controller to appear, you can set its dimensions to zero or one.
Place the tag at the end of the document.
Example
<object data="blues.aif" height="150" width="250"></object>
Value
Positive integer values (optionally quoted) or percentage values
(quoted).
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).height
[window.]document.getElementById(elementID).width
hspace, vspace | NN 6 IE 3 HTML 4 |
hspace="pixelCount"
vspace="pixelCount" A margin that acts as whitespace padding around the visual content of
the object element's rectangular
space. hspace establishes a margin on the left and
right sides of the rectangle; vspace establishes a
margin on the top and bottom sides of the rectangle.
Example
<object data="blues.aif" height="150" width="250" vspace="10" hspace="10"></object>
Value
Integer representing the number of pixels for the width of the margin
on the relevant sides of the object
element's rectangle.
Default
0
Object Model Reference
[window.]document.getElementById(elementID).hspace
[window.]document.getElementById(elementID).vspace
name="elementIdentifier" | Optional | The HTML 4 specification provides for a name
attribute of the object element for instances in
which the object is part of a form that is submitted to the server.
The name attribute in this case performs the same
function as the name attribute of an
input element; it acts as a label for some data
being submitted. The code that is loaded into the
object element must be programmed to return a
value if it is to be submitted via an HTML form. Through Version 6,
mainstream browsers list support for this attribute for compatibility
claims, but do not respond to its value. Use the
id attribute to assign an identifier that scripts
use to reference the object.
Example
<object name="embedded" classid="clsid:83A38BF0-B33A-A4FF-C619A82E891D"
height="150" width="250"></object>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).name
standby="HTMLText" | Optional | HTML content to be displayed while the object is
loading. This attribute has not been implemented in Version 6
browsers (although it works in IE 5/Mac); presumably the message is
to be displayed in the rectangular region intended for the
object element, just as the alt
message appears in an img element space while the
image loads.
Example
<object classid="clsid:83A38BF0-B33A-A4FF-C619A82E891D"
height="150" width="250" standby="Loading movie..."></object>
Value
Any HTML content.
Default
None.
An advisory about the content type of the data referred to by the
data attribute. A browser might use this
information to assist in preparing support for a resource requiring a
multimedia player or plugin. The data element
first looks to the codetype attribute for this
information. But if the codetype attribute is
missing, the browser looks next for the type
attribute setting. If both attributes are missing, the browser tries
to get the content type information from the resource as it
downloads. To be on the safe side, always specifiy a MIME type for
image data (e.g., image/jpeg or
image/gif).
Example
<object data="movies/prodDemo.mpeg" type="application/mpeg"></object>
Value
Case-insensitive MIME type. A catalog of registered MIME types is
available from ftp://ftp.isi.edu/in-notes/iana/assignments/media-types/.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).type
The HTML 4 specification lists the usemap
attribute for an object element, thus offering the
possibility of using the object element to load an image that gets
used as an image map. Version 6 browsers (and IE 5/Mac) provide this
capability.
Assign the URI of the image to the data attribute,
and assign a MIME type for the image to the type
property. Create a separate map element with one or more nested
area elements, and assign the
map element's
name identifier to the object
element's usemap attribute.
IE/Windows pads the image and adds scrollbars, so you may not achieve
successful cross-browser deployment. Netscape 6 and IE 5/Mac
essentially duplicate the traditional client-side image map
functionality through the object element. They
also display the typical link border around the image unless you also
set the border attribute to zero.
Example
<object data="navbar.jpg" type="image/jpeg" alt="Navigation Bar" usemap="#navbarMap"
border="0"></object>
Value
See the usemap attribute of the
img element.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).useMap
See hspace.
See height.
<ol> | NN all IE all HTML all |
<ol>...</ol> | HTML End Tag: Required | The ol element is a container for an ordered list
of items. An "ordered list" means
that the items are rendered with a leading sequence number or letter
(depending on the type attribute setting or
list-style-type style sheet attribute setting).
Content for each list item is defined by a nested
li element. If you apply a style sheet rule to an
ol element, the style is inherited by the nested
li elements.
Example
<ol>
<li>Choose Open from the File menu.</li>
<li>Locate the file you wish to edit, and click on the filename.</li>
<li>Click the Open button.</li>
</ol>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
Element-Specific Event Handler Attributes
None.
A Boolean attribute originally designed to let browsers render the
list in a more compact style than normal (smaller line spacing
between items). Although listed as a supported attribute for HTML
compatibility, the compact attribute has no effect
on mainstream browsers. Use style sheets to control element sizes and
line spacing.
Example
<ol compact>...</ol>
Value
The presence of this attribute makes its value
true.
Default
false
start | NN all IE all HTML all |
Assigns a custom starting number for the sequence of items in the
ol element. This is convenient when a sequence of
items must be disturbed by running body text. Although the value is a
number, the corresponding Arabic numeral, Roman numeral, or alphabet
letter is used to render the value.
Example
<ol start="5"> ...</ol>
Value
Any positive integer.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).start
type | NN all IE all HTML 3.2 |
The type attribute provides some flexibility in
how the sequence number is displayed in the browser. For an ordered
list, the choices are among letters (uppercase or lowercase), Roman
numerals (uppercase or lowercase), or Arabic numerals. The
type attribute is deprecated in HTML 4 in favor of
the list-style-type style sheet attribute.
Example
<ol type="a">...</ol>
Value
Possible values are A | a |
I | i | 1.
Sequencing is performed automatically as follows.
Type
|
Example
|
A
|
A, B, C, ...
|
a
|
a, b, c, ...
|
I
|
I, II, III, ...
|
i
|
i, ii, iii, ...
|
1
|
1, 2, 3, ...
|
Default
1
Object Model Reference
[window.]document.getElementById(elementID).type
<optgroup> | NN 6 IE 5(Mac)/6(Win) HTML 4 |
<optgroup>...</optgroup> | HTML End Tag: Required | The optgroup element is a container for
option elements within a select
element. Each optgroup can represent a subgroup of
options within the total list of select elements.
In IE 6/Windows and Netscape 6, the label text appears in a
bold-italic font and is not selectable. Regular
option element text is then listed below the label
and is indented. In IE 5/Mac, the presence of
optgroup elements turns a popup menu into a
two-level hierarchical menu.
Example
<select name="carCos">
<optgroup label="American">
<option value="General Motors">General Motors</option>
<option value="Ford">Ford Motor Company</option>
<option value="Chrysler">DaimlerChrysler</option>
</optgroup>
<optgroup label="Japanese">
<option value="Toyota">Toyota</option>
<option value="Honda">Honda</option>
<option value="Nissan">Nissan</option>
</optgroup>
</select>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
Element-Specific Event Handler Attributes
None.
disabled | NN 6 IE 5/6 HTML 4 |
The presence of this attribute disables the
optgroup element and its nested
option elements. Other optgroup
elements remain enabled.
Example
<optgroup label="Engineering" disabled>
Value
The presence of this attribute sets its value to
true.
Default
false
Object Model Reference
[window.]document.getElementById(elementID).disabled
label="labelText" | Required | The text of the select element entry for the
optgroup is defined by the
label attribute. This is plain text, not HTML, and
the user cannot select this text from the list.
Example
<optgroup label="Engineering" disabled>
Value
Any string of characters. The string must be inside a matching pair
of (single or double) quotation marks.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).label
<option> | NN all IE all HTML all |
<option>...</option> | HTML End Tag: Optional | The option element defines an item that appears in
a select element listing, whether the listing is
in a pop-up menu or scrolling list. option
elements associated with a select element must be
nested within the start and end tags of the select
element.
select elements supply name/value pairs when the
element is submitted as part of a form element.
Typically, the name attribute of the
select element and the value
attribute of the selected option are submitted as the name/value
pair. Therefore, it is important to assign a meaningful value to the
value attribute of each option
element in a select list. You can use the value
attribute to disguise user-unfriendly (but server- or
script-friendly) values from the user, while presenting a
user-friendly entry that appears in the select list. Content for the
human-readable entry of a select list is entered after the
option element's start tag. The
end tag is optional because the entry is delimited either by the next
option element start tag or the
select element's end tag. See
also the optgroup attribute for possible future
grouping of option elements into hierarchical menu
groupings.
Example
<select name="chapters">
<option value="1">Chapter 1</option>
<option value="2">Chapter 2</option>
<option value="3">Chapter 3</option>
<option value="4">Chapter 4</option>
</select>
Object Model Reference
[window.]document.formName.selectName.optionName
[window.]document.forms[i].elements[j].options[k].optionName
[window.]document.getElementById(elementID)
Element-Specific Attributes
disabled
|
label
|
selected
|
value
|
Element-Specific Event Handler Attributes
None.
disabled | NN 6 IE 5/Mac HTML 4 |
The presence of this attribute disables the option
element in the list. Note that although the attribute disables the
list choice in IE 5/Mac, as of Version 6, IE/Windows provides no
other functionality for this attribute.
Example
<option value="Met101" disabled>Meteorology 101</option>
Value
The presence of this attribute sets its value to
true.
Default
false
Object Model Reference
[window.]document.formName.selectName.optionName.disabled
[window.]document.forms[i].elements[j].options[k].optionName.disabled
[window.]document.getElementById(elementID).disabled
label | NN n/a IE n/a HTML 4 |
label="labelText" | Required | The label attribute is included in HTML 4.0 in
anticipation of possible hierarchical select lists. The
label is intended to be a shorter alternate entry
for an option element when it is rendered
hierarchically. It overrides the normal text associated with the
option element. Note that IE 5/Mac incorrectly
displays the label attribute value in lieu of the
element's text. Version 6 browsers provide no
practical functionality for this attribute.
Example
<option label="Meteo 101" value="met101">Meteorology 101</option>
Value
Any string of characters. The string must be inside a matching pair
of (single or double) quotation marks.
Default
None.
selected | NN all IE all HTML all |
The presence of the selected attribute preselects
the item within the select element. When the
select element is set to
multiple, more than one option
element may have the selected attribute set.
Example
<option value="met101" selected>Meteorology 101</option>
Value
The presence of this attribute sets its value to
true.
Default
false
Object Model Reference
[window.]document.formName.selectName.optionName.selected
[window.]document.forms[i].elements[j].options[k].selected
[window.]document.getElementById(elementID).selected
value | NN all IE all HTML all |
Associates a value with an option that may or may
not be the same as the text displayed in the
select element. When the select
element is in a form submitted to the server, the value of the
value attribute is assigned to the name/value pair
for the select element if the option has been
selected by the user (or is designated as selected
with that attribute and the user has made no other selection). For
scripting purposes, the value attribute might
contain values such as URLs or string representations of objects that
may subsequently be processed by scripts.
Example
<option value="met101">Meteorology 101</option>
Value
Any string of characters. The string must be inside a matching pair
of (single or double) quotation marks.
Default
None.
Object Model Reference
[window.]document.formName.selectName.optionName.value
[window.]document.forms[i].elements[j].options[k].optionName.value
[window.]document.getElementById(elementID).value
<p> | NN all IE all HTML all |
<p>...</p> | HTML End Tag: Optional | A p element defines a paragraph structural element
in a document. With HTML 4, the p element is
formally a block-level element, which means that content for a
p element begins on its own line, and content
following the p element starts on its own line. No
other block-level elements may be nested inside a
p element. If you omit the end tag (not
permissible in XHTML), the element ends at the next block-level
element start tag.
The nature of the p element has changed over time.
In early implementations of HTML, the element represented only a
paragraph break (a new line with some extra line spacing). Version 4
and later browsers render p elements in a hybrid
way such that the start tag of a p element inserts
a line space before the block. This means that a p
element cannot start at the very top of a page unless it is
positioned via CSS. Use the p element for
structural purposes, rather than formatting purposes.
The content of a p element does not recognize
extra whitespace that appears in the source code. Other elements,
such as pre, render content just as it is
formatted in the source code.
Example
<p>This is a simple, one-sentence paragraph.</p>
<p>This second paragraph starts on its own line, with a little extra
line spacing.</p>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
Element-Specific Event Handler Attributes
None.
align | NN all IE all HTML 3.2 |
Determines how the paragraph text is justified within the box that
the p element occupies. See the discussion about
horizontal alignment for a block element's content
in Section 8.1.5
earlier in this chapter.
The align attribute is deprecated in HTML 4 in
favor of the text-align style sheet attribute.
Example
<p align="center">...</p>
Value
Text alignment values are center |
justify | left|
right, although the justify
value does not validate in strict HTML or XHTML DTDs.
Default
left
Object Model Reference
[window.]document.getElementById(elementID).align
<param> | NN 2 IE 3 HTML 3.2 |
<param> | HTML End Tag: Forbidden | The param element may be nested within an
applet or object element to
pass parameters to the Java applet or object (typically, an ActiveX
control in IE) as it is being loaded. Parameters provide ways for
HTML authors to adjust settings of an applet or object without having
to recode the applet or object. A parameter typically passes a
name/value pair, which is assigned to the name and
value attributes. You can have more than one
param element per applet or object. The
documentation for the applet or object should provide you with the
information necessary to pass those parameter values.
Example
<applet code="simpleClock.class" name="myClock" width="400" height="50">
<param name="bgColor" value="black">
<param name="fgColor" value="yellow">
</applet>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
datafld
|
dataformatas
|
datasrc
|
name
|
type
|
value
|
valuetype
|
|
|
|
Element-Specific Event Handler Attributes
None.
datafld | NN n/a IE 4 HTML n/a |
datafld="columnName" | Optional | Used with IE data binding to associate a remote data source column
name with the parameter passed to a Java applet or object. In the
following example, data from a data source's column
named backColor is assigned to the
value attribute, even though the attribute is not
explicitly shown in the tag. More complex relationships are also
possible with both object and
applet elements. datafld works
only with text file data sources in IE 5/Mac.
Example
<param name="bgColor" datasrc="DBSRC2" dataformatas="text" datafld="backColor">
Value
Case-sensitive identifier.
Default
None.
dataformatas | NN n/a IE 4 HTML n/a |
dataformatas="dataType" | Optional | Used with IE data binding, this attribute advises the browser whether
the source material arriving from the data source is to be treated as
plain text or as tagged HTML. This attribute setting depends entirely
on how the data source is constructed and what kind of data the
param element is expecting.
dataformatas works only with text file data
sources in IE 5/Mac.
Example
<param name="bgColor" datasrc="DBSRC2" dataformatas="text" datafld="backColor">
Value
IE recognizes two possible settings: text |
html.
Default
text
datasrc | NN n/a IE 4 HTML n/a |
datasrc="dataSourceName" | Optional | Used with IE data binding to specify the ID of the
page's object element that loads
the data source object for remote data access. Content from the data
source is specified via the datafld attribute.
datasrc works only with text file data sources in
IE 5/Mac.
Example
<param name="bgColor" datasrc="DBSRC2" dataformatas="text" datafld="backColor">
Value
Case-sensitive identifier.
Default
None.
name="elementIdentifier" | Required | Assigns an identifier for the parameter that the applet or object is
expecting. Parameters generally supply a name/value pair. An applet,
for example, includes a routine that fetches each parameter by name
and assigns the passed value to a variable within the applet.
Documentation for the applet or object should provide a list of names
and value types corresponding to the param
elements.
Example
<param name="loop" value="4">
Value
Case-sensitive identifier.
Default
None.
When the valuetype attribute is set to
"ref", the type attribute value
advises the browser about the content type of the file referenced by
the URL assigned to the value attribute. Omit the
type attribute for other settings of the
valuetype attribute.
Example
<param name="help" value="http://www.giantco.com/help.html" valuetype="ref"
type="text/html">
Value
Case-insensitive MIME type. A catalog of registered MIME types is
available from ftp://ftp.isi.edu/in-notes/iana/assignments/media-types/.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).type
value="runTimeParameterValue" | Optional | The parameter value to be passed to an applet or object as the
executable program or data loads. Parameter values are passed as
string values, and it is up to the applet or object to perform the
necessary internal coercion of the data to the desired data type. The
value attribute is listed as optional because
there may be instances in which the presence of the
param element name attribute
may be sufficient for the object. Once the applet or object loads its
associated parameter values, scripts cannot dynamically modify those
values unless the applet or object is scriptable and exposes methods
designed to modify the values.
Example
<param name="loop" value="4">
Value
Any string value.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).value
valuetype | NN 6 IE 6 HTML 4 |
valuetype="paramValueType" | Optional | object element parameters can come in three
flavors: data, object, and
ref. The valuetype attribute
uses these constants to tell the browser how to treat the value
assigned to the value attribute for passing to the
object. When the valuetype is
data, the value attribute is
passed as a plain text string. A valuetype of
object means that the value
attribute consists of an identifier (id attribute
value) of some other object element defined
earlier in the same document. The other object may be one whose
declare attribute is set, and now the parameter
values are being passed to instantiate the object. When
valuetype is ref, the
value attribute is a URL that points to a file or
other resource where runtime values are stored (perhaps a set of
parameter values).
Example
<param name="anime" value="http://www.giantco.com/params/animation.txt"
valuetype="ref" type="text/html">
Value
Three possible constant values: data |
object | ref.
Default
data
Object Model Reference
[window.]document.getElementById(elementID).valueType
<plaintext> | NN all IE all HTML <4 |
<plaintext>...</plaintext> | HTML End Tag: Optional | The plaintext element displays its content in a
monospace font as a block element, but with a twist. All document
source code coming after the start tag is rendered as-is in the
browser window. You cannot turn off the plaintext
element. Even the end tag is rendered as-is. This element has been
long deprecated in HTML and has even been removed from the HTML 4.0
specification. You are encouraged to use the pre
element instead.
Specifying any element attribute in Internet Explorer 4 for the
Macintosh causes the plaintext element to be
ignored. In other words, the source code is rendered and the
attribute is applied to the content contained by the element if
applicable (such as a style sheet rule).
Example
<p>The rest of the HTML code follows:</p>
<plaintext>
...
</plaintext>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<pre> | NN all IE all HTML all |
<pre>...</pre> | HTML End Tag: Required | The pre element defines a block of preformatted
text. Preformatted text is usually rendered by default in a monospace
font and, more importantly, it preserves the whitespace (multiple
spaces between words and new lines) entered into the source code for
the content. Unlike the deprecated plaintext
element, the pre element doesn't
ignore HTML tags. Instead, it passes such tags onto the browser for
normal rendering. If you want to display HTML tags in a block of
preformatted text, use entities for the less-than
(<) and greater-than
(>) symbols. This prevents the HTML tags
from being interpreted as genuine tags but renders the symbols within
the preformatted text block.
Browsers are supposed to ignore a whitespace line break immediately
following a pre element start tag in case you wish
to start the content on a new line in the source code. By and large,
the Version 4 browsers follow this rule (with the exception of IE 4
for the Mac).
The HTML 4 specification is adamant about the pre
element maintaining its monospaced font size and line spacing. It
lists the following elements that should not be included inside a
pre element: applet,
basefont, big,
font, img,
object, small,
sub, and sup. Any one of these
destroys the fixed-size pitch of the pre element.
The recommendation also encourages authors to avoid overriding the
monospaced font settings with style sheets.
One last admonition concerns using tab characters to indent or align
text within a pre element. Not all browsers render
tab characters the same way. Avoid potential problems by using space
characters and let the pre
element's preservation of whitespace do the job. No
nonbreaking space entities ( ) are
necessary in a pre element.
Example
<p>Here is the script example:</p>
<pre>
<script language="JavaScript">
document.write("Hello, world.")
</script>
</pre>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
Element-Specific Event Handler Attributes
None.
cols | NN all IE n/a HTML n/a |
cols="columnCount" | Optional | The maximum number of characters per line of preformatted code. This
Navigator-specific attribute automatically sets the
wrap attribute to true. Without
this attribute, the source code formatting (or
width attribute, where supported) governs the line
width.
Example
<pre cols="80">...</pre>
Value
Any positive integer.
Default
None.
width | NN n/a IE n/a HTML 4 |
width="columnCount" | Optional | The HTML 4 specification introduces the width
attribute to allow you to set a maximum number of characters to be
rendered on a preformatted line of text. Presumably, browsers that
support this attribute in the future will wrap lines so that words do
not break in the middle. Without this attribute, the source code
formatting governs the line width. Navigator provides this
functionality with the cols attribute. Note that
the CSS width attribute does not affect this
element in IE 5/Mac or IE 6/Windows. Even when it does, however, the
units of measure do not include a character count.
Example
<pre width="80">...</pre>
Value
Any positive integer.
Default
None.
wrap | NN all IE n/a HTML n/a |
The presence of the wrap attribute instructs
Navigator to wrap preformatted text so that text does not run beyond
the right edge of the browser window or frame.
wrap is set to true
automatically when the cols attribute is set.
Example
<pre wrap>...</pre>
Value
The presence of the attribute sets its value to
true.
Default
false
<q>...</q> | HTML End Tag: Required | The q element is intended to set off an inline
quote inside a document. The HTML 4 specification indicates that
browsers should automatically surround the content of a
q element with language-sensitive quotation marks,
and that authors should not include quotes. Netscape 6 supports this
requirement, but IE 6/Windows does not. IE 5/Mac inserts quotes, but
if the element's parent container is not
left-aligned, the quotes float out of place. Internet Explorer 4 does
not render such quote marks. If you need quotes around quoted text,
you have no choice at this point but to include them yourself and not
use the q element (because a future browser may
add those quotes to the content). For a block-level quotation, see
the blockquote element.
Example
<p>The preamble to the u.s. Constitution begins,
<q>We the People of the United States</q></p>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
Element-Specific Event Handler Attributes
None.
A URL pointing to an online source document from which the quotation
is taken. This is not in any way a mechanism for copying or
extracting content from another document. Presumably, the purpose of
this HTML 4 recommendation is to encourage future browsers and search
engines to utilize a reference to online source material for the
benefit of readers and surfers. Version 6 browsers provide no
practical functionality for this attribute.
Value
Any valid URL to a document on the World Wide Web, including absolute
or relative URLs.
Default
None.
<rb> | NN n/a IE n/a HTML X1.1 |
<rb>...</rb> | End Tag: Required | The rb element denotes the base text within a
ruby-enhanced section of content. This is the regular text to which
ruby annotation is added. IE 5 and later supports ruby text, but the
rb element is not explicitly supported, and is
assumed to automatically apply to text other than what is encased
inside rt elements.
Example
<ruby>
<rb>03</rb><rt>Month</rt>
<rb>04</rb><rt>Day</rt>
<rb>2003</rb><rt>Year</rt>
</ruby>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<rbc>, <rtc> | NN n/a IE n/a HTML X1.1 |
<rbc>...</rbc>
<rtc>...</rtc> If you want to string together a contiguous sequence of ruby base
items and their associated ruby text items, you can group all base
items and all text items together inside rbc and
rtc containers, respectively. The number of items
inside the rbc and rtc elements
should be the same so that the browser can keep the base and ruby
text items together. Using this approach does not degrade well in
browsers that do not support ruby text.
Example
<ruby>
<rbc>
<rb>03</rb><rb>04</rb><rb>2003</rb>
</rbc>
<rtc>
<rt>Month</rt><rt>Day</rt><rt>Year</rt>
</rtc>
</ruby>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<rp> | NN n/a IE 5 HTML X1.1 |
<rp>...</rp> | End Tag: Required | The ruby markup module features the rp element to
ease compatibility with browsers that don't support
ruby markup directly. Non-ruby browsers render both the
rp and rt element content as
inline text. The rp element gives you a chance to
include parentheses (or other character) around the ruby text so that
the ruby text acts as an inline label. Content of each
rp element is traditionally either a left or right
parenthesis symbol. A complete rp element goes
before and after each rt element. Browsers that
support ruby text ignore the rp element content,
and, thus, don't display the parentheses.
Example
<ruby>
<rb>03</rb><rp>(</rp><rt>Month</rt><rp>)</rp>
<rb>04</rb><rp>(</rp><rt>Day</rt><rp>)</rp>
<rb>2003</rb><rp>(</rp><rt>Year</rt><rp>)</rp>
</ruby>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<rt> | NN n/a IE 5 HTML X1.1 |
<rt>...</rt> | End Tag: Required | The rt element contains the text that is the
annotation for a corresponding rb element.
Browsers that support ruby text usually render rt elements in a
smaller font size than the base text. Through style sheet assignment,
you can also use alternate font families. You can also assign
different a language set for the ruby text via the
xml:lang attribute of the rt
element.
Example
<ruby>
<rb>03</rb><rt>Month</rt>
<rb>04</rb><rt>Day</rt>
<rb>2003</rb><rt>Year</rt>
</ruby>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
Element-Specific Event Handler Attributes
None.
rbspan | NN n/a IE n/a HTML X1.1 |
In some cases, you may want one rt element to span
two or more contiguous rb elements. Assign the
number of rb elements to the rt
element's rbspan attribute. The
mechanism is similar to the td element
colspan attribute.
Value
Integer number of rb elements.
Default
1
<ruby> | NN n/a IE 5 HTML X1.1 |
<ruby>...</ruby> | End Tag: Required | Ruby text is small-font annotation that usually appears above or
below the main body text (or to one side in vertically-oriented
writing systems). The name comes from a small font that was used in
typography to create the small annotation text. Ruby text is more
commonly employed in pictographic languages, where the ruby text
supplies a pronounciation guide to the main text pictographic
symbols. But ruby text can be used with Latin alphabet languages,
too.
The ruby element is a master container for all
content to be affected by ruby markup, including the main text. The
main text is known as the ruby base, while the
annotation is called ruby text. Each of these
types has its own tag (rb and
rt, respectively), and any such tags must be
encased within a ruby element. IE implemented the
basics of ruby markup starting with Version 5 (Windows and Mac).
The W3C ruby markup specification was developed independently of the
HTML recommendation, and was added to XHTML 1.1 as one of the first
modules to take advantage of the extensible nature of XHTML.
Example
<ruby>
<rb>03</rb><rt>Month</rt>
<rb>04</rb><rt>Day</rt>
<rb>2003</rb><rt>Year</rt>
</ruby>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<s>...</s> | HTML End Tag: Required | The s element renders its content as strikethrough
text. This element is identical to the strike
element; it was adopted because it more closely resembled the
one-character element names for other type formatting (such as
b, i, and u
elements). In any case, both s and
strike elements are deprecated in HTML 4 in favor
of the text-decoration:line-through style sheet
attribute.
Example
<p>If at first you don't succeed, <s>do it over</s> try, try again.</p>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<samp> | NN all IE all HTML all |
<samp>...</samp> | HTML End Tag: Required | The samp element is one of a large group of
elements that the HTML 4 recommendation calls phrase
elements. Such elements assign structural meaning to a
designated portion of the document. A samp element
is one that contains text that is sample output from a computer
program or script. This is different from a code example, which is
covered by the code element.
Browsers have free rein to determine how (or whether) to distinguish
samp element content from the rest of the
body element. Both Navigator and Internet Explorer
elect to render the text in monospace font. Override the default with
a style sheet as you see fit.
Example
<p>When you press the Enter key, you will see <samp>Hello, world!</samp>
on the screen.</p>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<script>...</script> | HTML End Tag: Required | The script element provides a container for lines
of script code written in any scripting language that the browser is
capable of interpreting. Script statements that are not written
inside a function definition are executed as the page loads; function
definitions are loaded but their execution is deferred until
explicitly invoked by user or system action (events). You can have
more than one script element in a document, and
you may include script elements written in
different script languages within the same document.
An important shift in attribute syntax is introduced with HTML 4. To
specify the scripting language of the statements within a
script element, the language
attribute has been used since the first scriptable browsers. HTML 4
deprecates that attribute in favor of the type
attribute, whose value is a MIME type. Until you know for certain
that your page visitors use only newer browsers that support the
type attribute, you should include both attributes
in documents for long-term backward compatibility with older
browsers. The language attribute validates with
transitional DTDs.
All but the earliest scriptable browsers also allow script statements
to be imported into the document from a document whose URL is
specified for the src attribute.
Older, nonscriptable browsers don't recognize the
script element and may attempt to render the
script statements as regular HTML content. To prevent this, wrap the
script statements inside HTML block comment markers. The
end-of-comment marker (-->) must be preceded by
a JavaScript comment marker (//) to prevent
JavaScript from generating a script error.
Due to character conflicts between JavaScript and XHTML, and the lack
of browser support for the XHTML-preferred
<![CDATA[...]]> script wrapper, you should
use imported script libraries for pages that must validate under
XHTML. This prevents XML parsers from misinterpreting symbols such as
the less-than operator (<) as XML markup
symbols.
Example
<script type="text/javascript" language="JavaScript">
<!--
function howdy( ) {
alert("Hello, HTML world!");
}
//-->
</script>
<script type="text/javascript" scr="scripts/myscript.js"></script>
Element-Specific Attributes
charset
|
defer
|
event
|
for
|
language
|
src
|
type
|
version
|
xml:space
|
|
Element-Specific Event Handler Attributes
None.
charset | NN 6 IE n/a HTML 4 |
charset="characterSet" | Optional | Character encoding of the content in the file referred to by the
src attribute.
Example
<script charset="csISO5427Cyrillic" src="moscow.js"> . . . </script>
Value
Case-insensitive alias from the character set registry (ftp://ftp.isi.edu/in-notes/iana/assignments/character-sets).
Default
Determined by browser.
The presence of the defer attribute instructs the
browser to render regular HTML content without looking for the script
to generate content as the page loads. This is an advisory attribute
only. The browser doesn't have to hold up rendering
further HTML content as it parses the content of the
script element in search of
document.write( ) statements. As of Version 7,
Netscape allows but does not respond to the defer
attribute.
Example
<script type="text/javascript" language="JavaScript" defer>...</script>
Value
The presence of this attribute sets its value to
true.
Default
false
Object Model Reference
[window.]document.getElementById(elementID).defer
event | NN n/a IE 4 HTML |4| |
event="eventName" | Optional | Internet Explorer's event model allows the binding
of object events to script elements with the help
of the event and for
attributes. As the page loads, the browser registers each
script element with its event and object binding
so that when the object generates the event, the script statements
inside the script element execute—without
having to write event handlers for the objects or wrap the script
statements inside function definitions. Event values are written
either as unquoted event names or as quoted event names formatted as
functions (with trailing parentheses and optional parameter names).
Use this type of script-event binding only in Internet Explorer.
Navigator attempts to execute the script statements while the page
loads. The transitional HTML 4 DTD reserves this attribute for
possible future use, but the reservation doesn't
hold for XHTML 1.0.
Example
<script for="window" event="onresize( )">...</script>
Value
Case-sensitive event name or the event name as a function inside a
quote pair. The object described in the for
attribute must support the event named in the
event attribute.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).event
Internet Explorer's event model allows the binding
of object events to script elements with the help
of the event and for
attributes. As the page loads, the browser registers each
script element with its event and object binding
so that when the object generates the event, the script statements
inside the script element execute—without
having to write event handlers for the objects or wrap the script
statements inside function definitions. Use the unique
id attribute value of the element whose event you
wish to handle. Use this type of script-event binding only in
Internet Explorer. Navigator attempts to execute the script
statements while the page loads. The transitional HTML 4 DTD reserves
this attribute for possible future use, but the reservation
doesn't hold for XHTML 1.0.
Example
<script for="firstNameEntry" event="onchange( )">...</script>
Value
Case-sensitive ID value of the event-generating element. The object
described in the for attribute must support the
event named in the event attribute.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).htmlFor
language="scriptingLanguage" | Optional | Sets the scripting language for script statements defined in the
element. This attribute is deprecated in HTML 4 (in favor of the
type attribute), but it has been so widely used
since the first days of scriptable browsers that its use and support
will continue for a long time to come. Moreover, it is so far the
only accepted way to convey the JavaScript version for the script
block (e.g., see the Array object in Chapter 12).
Example
<script language="JavaScript">...</script>
Value
Internet Explorer recognizes four case-insensitive language names:
JavaScript | JScript |
vbs | vbscript. Navigator
recognizes only JavaScript. Versions of JavaScript
are also supported in appropriate browsers. To keep the attribute
values one-word identifiers, the version numbers are tacked onto the
end of the "JavaScript" language name. The
version-less "JavaScript" is observed by all
browsers; "JavaScript1.1" is recognized only by
Navigator 3; "JavaScript1.2" is recognized by
Navigator 4.0-4.05 and Internet Explorer 4;
"JavaScript1.3" applies to Navigator 4.06-4.7x and
IE 5-6; "JavaScript1.5" applies to Netscape 6-7.
When script elements are assigned these later
version values, older browsers that don't support
the named version ignore the script elements.
Default
JavaScript (NN); JScript (IE).
Object Model Reference
[window.]document.getElementById(elementID).language
Imports a file of script statements from an external file. Once the
external statements are loaded, the browser treats them as if they
were embedded in the main HTML document. This attribute had some
support in Internet Explorer 3, but it relied on a specific
JScript.dll version, which makes it unreliable
to blindly use in IE 3.
In theory, you should be able to add script statements inside a
script element that loads an external script
library file. In practice, it is more reliable to provide a separate
script element for each external library file and
for in-document scripts.
Current implementations limit the src attribute to
point to JavaScript external files. Such files must have a
.js filename extension, and the server must have
the extension and application/x-javascript MIME
type set to serve up such files.
When assigning the src attribute in an XHTML
document, browsers may not like the shortcut end tag format.
Don't think of the tag as an empty element, but
rather as one with content that arrives from an external source. Use
an explicit </script> end tag.
Example
<script language="JavaScript" type="text/javascript" src="stringParseLib.js">
</script>
Value
Any valid URL. Current browsers require files with names that end in
the .js extension. A complete URL may help
overcome difficulties in earlier browsers that implement this
feature.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).src
An advisory about the content type of the script statements. The
content type should tell the browser which scripting engine to use to
interpret the script statements. The type
attribute will eventually replace the language
attribute as the one defining the scripting language in which the
element's statements are written. To be compatible
with future and past browsers, you may include both the
language and type attributes in
a script element.
Example
<script type="text/javascript" language="JavaScript">...</script>
Value
Case-insensitive MIME type. Values are limited to one(s) for which a
particular browser is equipped. IE 4 and later and Netscape 6 accept
text/javascript and
application/x-javascript for scripts in an
ECMAScript-compatible language. IE also accepts the following types:
text/ecmascript, text/jscript,
text/vbs (IE/Windows),
text/vbscript (IE/Windows), and
text/xml (IE 5 and later).
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).type
version | NN n/a IE n/a HTML n/a |
This attribute is listed here as a possible future implementation for
Mozilla-based browsers. Most of the pieces that support this
attribute (to complement the type attribute) are
in place in the Netscape 6 (Mozilla) browser engine, but as of
Netscape 7, are not yet connected.
Example
<script type="text/javascript" version="1.5">...</script>
Value
Language version expressed as major and minor version integers,
separated by a period.
xml:space | NN n/a IE n/a HTML X1.0 |
xml:space="preserve" | Optional | An XHTML parser is supposed to expunge all source code whitespace as
it processes the document. This removal may harm scripts. By
including the XML namespace space attribute, you
instruct the parser to keep source code whitespace of script element
content intact.
Example
<script type="text/javascript" xml:space="preserve">...</script>
Value
Constant value: preserve.
Default
None.
<select> | NN all IE all HTML all |
<select>...</select> | HTML End Tag: Required | The select element displays information from
nested option elements as either a scrolling list
or pop-up menu in a document. Users typically make a selection from
the list of items (or multiple selections from a scrolling list if
the size attribute is set greater than 1 and the
multiple attribute is set). The
value attribute of the selected
option item is submitted as the value part of a
name/value pair to the server with a form. When the element is set to
allow multiple selections, multiple ampersand-delimited name/value
pairs (repeating the name of the element) are submitted with the
form. Navigator 4 requires that a select element
be placed inside a form element.
Example
<select name="chapters">
<option value="chap1.html">Chapter 1</option>
<option value="chap2.html">Chapter 2</option>
<option value="chap3.html">Chapter 3</option>
<option value="chap4.html">Chapter 4</option>
</select>
Object Model Reference
[window.]document.formName.selectName
[window.]document.forms[i].elements[j]
[window.]document.getElementById(elementID)
Element-Specific Attributes
accesskey
|
align
|
datafld
|
datasrc
|
disabled
|
multiple
|
name
|
size
|
tabindex
|
|
Element-Specific Event Handler Attributes
Handler
|
NN
|
IE
|
HTML
|
onafterupdate
|
n/a
|
4
|
n/a
|
onbeforeupdate
|
n/a
|
4
|
n/a
|
onchange
|
2
|
3
|
4
|
accesskey | NN n/a IE 4 HTML n/a |
accesskey="character" | Optional | This widely shared attribute is listed here to remind you that only
IE supports the attribute for the select element.
See the discussion among the shared attributes earlier in this
chapter.
align | NN n/a IE 4 HTML n/a |
align="alignmentConstant" | Optional | Determines how the rectangle of the select element
(particularly when the size attribute is set
greater than 1) aligns within the context of surrounding content. See
Section 8.1.5
earlier in this chapter. Note that only Internet Explorer supports
the align attribute for the
select element.
Example
<select name="chapters" multiple align="baseline">...</select>
Value
Case-insensitive constant value.
Default
bottom (IE/Windows); absmiddle
(IE/Macintosh).
Object Model Reference
[window.]document.formName.selectName.align
[window.]document.forms[i].elements[j].align
[window.]document.getElementById(elementID).align
datafld | NN n/a IE 4 HTML |4| |
datafld="columnName" | Optional | Used with IE data binding to associate a remote data source column
name to the selectedIndex property of a
select element (i.e., a zero-based index value of
the item currently selected in the list, as described in the
select object of Chapter 9). As such, you can use data binding only
with select elements that do not specify the
multiple attribute. A datasrc
attribute must also be set for the element. Works only with text file
data sources in IE 5/Mac.
This attribute was reserved in HTML 4, but was dropped in XHTML 1.0.
Example
<select name="chapters" datasrc="DBSRC3" datafld="chapterRequest">
<option value="chap1.html">Chapter 1</option>
<option value="chap2.html">Chapter 2</option>
<option value="chap3.html">Chapter 3</option>
<option value="chap4.html">Chapter 4</option>
</select>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.formName.selectName.dataFld
[window.]document.forms[i].elements[j].dataFld
[window.]document.getElementById(elementID).dataFld
datasrc | NN n/a IE 4 HTML |4| |
datasrc="dataSourceName" | Optional | Used with IE data binding to specify the ID of the
page's object element that loads
the data source object for remote data access. Content from the data
source is specified via the datafld attribute.
Works only with text file data sources in IE 5/Mac.
This attribute was reserved in HTML 4, but was dropped in XHTML 1.0.
Example
<select name="chapters" datasrc="#DBSRC3" datafld="chapterRequest">
<option value="chap1.html">Chapter 1</option>
<option value="chap2.html">Chapter 2</option>
<option value="chap3.html">Chapter 3</option>
<option value="chap4.html">Chapter 4</option>
</select>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.formName.selectName.dataSrc
[window.]document.forms[i].elements[j].dataSrc
[window.]document.getElementById(elementID).dataSrc
The presence of this attribute disables the entire
select element and its nested
option elements. The element receives no events
when it is disabled. You can also disable individual options through
those elements' disabled
properties.
Example
<select name="chapters" disabled>
<option value="chap1.html">Chapter 1</option>
<option value="chap2.html">Chapter 2</option>
<option value="chap3.html">Chapter 3</option>
<option value="chap4.html">Chapter 4</option>
</select>
Value
The presence of this attribute sets its value to
true.
Default
false
Object Model Reference
[window.]document.formName.selectName.disabled
[window.]document.forms[i].elements[j].disabled
[window.]document.getElementById(elementID).disabled
multiple | NN all IE all HTML all |
The presence of the multiple attribute instructs
the browser to render the select element as a list
box and to allow users to make multiple selections from the list of
options. By default, the size attribute is set to
the number of nested option elements, but the
value may be overridden with the size attribute
setting. Users can select contiguous items by Shift-clicking on the first and last items of
the group. To make discontiguous selections, Windows users must
Ctrl-click on each item; Mac users
must Command-click on each item. The
multiple attribute has no effect when
size is set to 1 to display a pop-up menu.
Example
<select name="equipment" multiple>
<option value="monitor">Video monitor</option>
<option value="modem">Modem</option>
<option value="printer">Printer</option>
...
</select>
Value
The presence of this attribute sets its value to
true.
Default
false
Object Model Reference
[window.]document.formName.selectName.multiple
[window.]document.forms[i].elements[j].multiple
[window.]document.getElementById(elementID).multiple
[window.]document.formName.selectName.type
[window.]document.forms[i].elements[j].type
[window.]document.getElementById(elementID).type
name | NN all IE all HTML all |
name="elementIdentifier" | Optional | The name submitted as part of the element's
name/value pair with the form. It is similar to the
name attribute of input
elements.
Example
<select name="cpu" id="cpu">
<option value="486">486</option>
<option value="pentium">Pentium</option>
<option value="pentium2">Pentium II</option>
...
</select>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.formName.selectName.name
[window.]document.forms[i].elements[j].name
[window.]document.getElementById(elementID).name
size | NN all IE all HTML all |
Controls the number of rows of option elements
that appear in the select element. With a value of
1, the select element displays its content as a
pop-up menu; with a value greater than 1, option
items are rendered in a list box. Browsers control the width of the
element, based on the widest text associated with nested
option elements.
Example
<select name="equipment" size="3">
<option value="monitor">Video monitor</option>
<option value="modem">Modem</option>
<option value="printer">Printer</option>
...
</select>
Value
Any positive integer.
Default
1
Object Model Reference
[window.]document.formName.selectName.size
[window.]document.forms[i].elements[j].size
[window.]document.getElementById(elementID).size
tabindex="integer" | Optional | This shared attribute is listed here to remind you that Netscape 6
and HTML 4 support it to facilitate accessibility to a complex form
control. Once the select element has focus, the
user can continue using the keyboard to make item choices. See the
discussion about this attribute earlier in this chapter.
<small> | NN 2 IE 3 HTML 3.2 |
<small>...</small> | HTML End Tag: Required | The small element renders its content in a
relative size one level smaller than the text preceding the element.
Given the font element's way of
specifying sizes in a range of 1 through 7, the
small element displays its content one size
smaller than the text that comes before it. This attribute is the
same as specifying <font
size=-1>.
Example
<p>Let's get really <small>small</small>.</p>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<spacer> | NN <6 IE n/a HTML n/a |
<spacer> | HTML End Tag: Forbidden | As a solution to the need for creating blank space without forcing
entities, incessant
<p> tags, or transparent images, Navigator 3
introduced the spacer element. This element
creates empty space within a line of text, between lines, or as a
rectangular space. Some of this functionality can be re-created in a
cross-browser implementation with style sheets. The element is
supported only in Navigator 3 and Navigator 4.
Example
<p>This is one line of a paragraph.
<spacer type="vertical" size="36">
And this completes the paragraph with a three-line gap from the first line.</p>
Element-Specific Attributes
align
|
height
|
size
|
type
|
width
|
Element-Specific Event Handler Attributes
None.
align | NN <6 IE n/a HTML n/a |
align="alignmentConstant" | Optional | Determines how a block type of spacer element
aligns within the context of surrounding content. See Section 8.1.5
earlier in this chapter for a description of the possibilities.
Example
<spacer type="block" height="90" width="40" align="absmiddle">
Value
Case-insensitive constant value.
Default
bottom
height, width | NN <6 IE n/a HTML n/a |
height="length"
width="length" The size that a block type spacer element occupies
in a document is governed by the height and
width attribute settings. These attributes apply
only when the type attribute is
block.
Example
<spacer type="block" height="150" width="250">
Value
Positive integer or percentage values.
Default
0
size | NN <6 IE n/a HTML n/a |
size="pixelCount" | Optional | The number of pixels of whitespace to insert either horizontally or
vertically, depending on whether the type
attribute is set to line or
vertical. If the type attribute
is set to block, the size
attribute is ignored.
Example
<spacer type="line" size="40">
Value
Any positive integer.
Default
0
type | NN <6 IE n/a HTML n/a |
type="spacerType" | Required | Defines which of the three spacer geometries is being specified for
the spacer element. A type of
line adds empty space in the same line of text as
the preceding content; a type of vertical (or
vert) adds empty space between lines of text; and
a type of block defines a rectangular space that
extends in two dimensions. For the line and
vertical types, the size
attribute must be assigned; for the block type,
the height and width attributes
must be assigned.
Example
<spacer type="line" size="40">
Value
Any of four case-insensitive constant values:
block | line |
vertical | vert.
Default
line
See height.
<span>...</span> | HTML End Tag: Required | The span element gives structure and context to
any inline content in a document. Unlike some other structural
elements that have very specific connotations attached to them (the
p element, for instance), the author is free to
give meaning to each particular span element by
virtue of the element's attribute settings and
nested content. Each span element becomes a
generic container for all content within the required start and end
tags.
It is convenient to use the span element as a
wrapper for a small inline chunk of content that is to be governed by
a style sheet rule. For example, if you want to differentiate a few
words in a paragraph with the equivalent of a small caps look, you
would wrap the affected words with a span element
whose style sheet defines the requested font and text styles. Such a
style sheet could be defined as an inline style
attribute of the span element or assigned via the
class or id attribute depending
on the structure of the rest of the document.
If you need an arbitrary container for block-level content, use the
div element.
Example
<span style="font-size:10pt; text-transform:uppercase">
30-day special offer</span>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
datafld
|
dataformatas
|
datasrc
|
Element-Specific Event Handler Attributes
None.
datafld | NN n/a IE 4 HTML |4| |
datafld="columnName" | Optional | Used with IE data binding to associate a remote data source column
name with the HTML content of a span element. The
data source column must be HTML (see
dataformatas). datasrc and
dataformatas attributes must also be set for the
span element. Works only with text file data
sources in IE 5/Mac.
This attribute was reserved in HTML 4, but was dropped in XHTML 1.0.
Example
<span datasrc="DBSRC3" datafld="quote" dataformatas="HTML">...</span>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).dataFld
dataformatas | NN n/a IE 4 HTML |4| |
dataformatas="dataType" | Optional | Used with IE data binding, this attribute advises the browser whether
the source material arriving from the data source is to be treated as
plain text or as tagged HTML. A span element
should receive data only in HTML format.
This attribute was reserved in HTML 4, but was dropped in XHTML 1.0.
Example
<span datasrc="DBSRC3" datafld="quote" dataformatas="HTML">...</span>
Value
Case-insensitive constants: html |
text.
Default
text
Object Model Reference
[window.]document.getElementById(elementID).dataFormatAs
datasrc | NN n/a IE 4 HTML |4| |
datasrc="dataSourceName" | Optional | Used with IE data binding to specify the ID of the
page's object element that loads
the data source object for remote data access. Content from the data
source is specified via the datafld attribute.
Works only with text file data sources in IE 5/Mac.
This attribute was reserved in HTML 4, but was dropped in XHTML 1.0.
Example
<span datasrc="DBSRC3" datafld="quote" dataformatas="HTML">...</span>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).dataSrc
<strike> | NN 3 IE 3 HTML 3.2 |
<strike>...</strike> | HTML End Tag: Required | The strike element renders its content as
strikethrough text. This element is identical to the
s element, which was adopted because it more
closely resembled the one-character element names for other type
formatting (such as b, i, and
u elements). In any case, both
strike and s elements are
deprecated in HTML 4 in favor of the
text-decoration:line-through style sheet
attribute. Neither strike nor s
elements validate with strict HTML 4 or XHTML DTDs.
Example
<p>If at first you don't succeed, <strike>do it over</strike> try, try again.</p>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<strong> | NN all IE all HTML all |
<strong>...</strong> | HTML End Tag: Required | The strong element is one of a large group of
elements that the HTML 4 recommendation calls phrase
elements. Such elements assign structural meaning to a
designated portion of the document. A strong
element is one that contains text that indicates a stronger emphasis
than the em element. Whereas an
em element is typically rendered as italic text, a
strong element is generally rendered as boldface
text. Override the default with a style sheet as you see fit.
Example
<p>Don't delay. <strong>Order today</strong> to get the maximum discount.
</p>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<style>...</style> | HTML End Tag: Required | The style element is a container for style sheet
rules. Use the style element only inside the
head element. You may include more than one
style element in a head element
(see the media attribute).
Older browsers may attempt to render the content of a
style element. To prevent that, you should wrap
the style sheet rules inside HTML comment tags. See Chapter 3 for details on the makeup of style sheet
rules.
Example
<style type="text/css">
<!--
h1 {font-size:18pt; text-transform:capitalize}
p {font-size:12pt}
-->
</style>
Object Model Reference
[window.]document.getElementsByTagName("style")[i]
[window.]document.getElementById(elementID)
Element-Specific Attributes
Element-Specific Event Handler Attributes
None.
disabled | NN n/a IE 4 HTML n/a |
Disables the entire style element, as if it
didn't exist in the document. IE/Mac responds to
this attribute starting in Version 5.
The disabled attribute is a Boolean type, which
means that its presence in the attribute sets its value to
true. Its value can also be adjusted after the
fact by scripting (see the style object in Chapter 9).
Example
<style type="text/css" disabled>...</style>
Value
The presence of the attribute disables the element.
Default
false
Object Model Reference
[window.]document.getElementsByTagName("style")[i].disabled
[window.]document.getElementById(elementID).disabled
media="descriptorList" | Optional | Sets the intended output device for the content of the element. The
media attribute looks forward to the day when
browsers are able to tailor content to specific kinds of devices such
as pocket computers, text-to-speech digitizers, or fuzzy television
sets. The HTML 4 specification defines a number of constant values
for anticipated devices, but the list is open-ended, allowing future
browsers to tailor output to yet other kinds of media and devices.
Example
<style type="text/css" media="print">...</style>
Value
Case-sensitive constant values. Multiple values can be grouped
together in a comma-delimited list within a quoted string. Values
defined in HTML 4 are all |
aura | braille |
handheld | print |
projection | screen |
tty | tv. Internet Explorer
values are all | print
|screen.
Default
all
Object Model Reference
[window.]document.getElementsByTagName("style")[i].media
[window.]document.getElementById(elementID).media
The type attribute tells the browser which style
sheet syntax to use to interpret the style rules defined in the
current element.
Example
<style type="text/css">...</style>
Value
Case-insensitive MIME type. A type accepted by both Navigator 4 and
later and IE 4 and later is "text/css". Navigator
4 (only) also recognizes "text/javascript" when
using JavaScript syntax style sheets.
Default
text/css
Object Model Reference
[window.]document.getElementsByTagName("style")[i].type
[window.]document.getElementById(elementID).type
<sub>...</sub> | HTML End Tag: Required | The sub element is a typographical element that
instructs the browser to render its content as a subscript in a font
size consistent with the surrounding content. Browsers tend to render
this content in a smaller size than surrounding content.
Example
<p>"Heavy water" (H<sub>3</sub>O) has one more hydrogen atom than regular water.</p>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<sup>...</sup> | HTML End Tag: Required | The sup element is a typographical element that
instructs the browser to render its content as a superscript in a
font size consistent with the surrounding content. Browsers tend to
render this content in a smaller size than surrounding content.
Example
<p>This book is published by O'Reilly<sup>™</sup>.</p>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<table> | NN all IE all HTML 3.2 |
<table>...</table> | HTML End Tag: Required | The table element is a container for additional
elements that specify the content for a table. A table consists of
rows and columns of content. Other elements related to the
table element are caption,
col, colgroup,
tbody, td,
tfoot, th,
thead, and tr. The purpose of
the table element is to define a number of visible
attributes that apply to the entire table, regardless of the number
of rows or columns within it. Many of these attributes can be
overridden for a given row, column, or cell. The number of rows and
columns is strictly a factor of the structure of
tr and td elements within the
table.
Tables have been used for a relatively long time not only to organize
rows and columns of content but also to position content. With no
visible borders, table rows and columns can be set to empty space.
With the advent of positionable content, the tables-for-positioning
practice is not encouraged.
Deeply nested tables (tables within tables) can cause problems in
some browsers. Navigator 4 has severe difficulty with style sheet
inheritance and overall performance in complex tables (nesting beyond
three levels is asking for trouble). IE 5/Mac can inexplicably
explode cell dimensions when scripts create or modify table-related
elements. The simpler you keep your table structure, the more
reliable your pages will be across browsers. Heavy editing of table
structures in visual HTML authoring tools can leave hidden
complexities (e.g., lots of empty cells) in your source code.
Temporarily turn on a thin table border to see the exact row and
column structure.
Example
<table cols="3">
<thead>
<tr>
<th>Time</th><th>Event</th><th>Location</th>
</tr>
</thead>
<tbody>
<tr>
<td>7:30am-5:00pm</td><td>Registration Open</td><td>Main Lobby</td>
</tr>
<tr>
<td>9:00am-12:00pm</td><td>Keynote Speakers</td><td>Cypress Room</td>
</tr>
</tbody>
</table>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
align
|
background
|
bgcolor
|
border
|
bordercolor
|
bordercolordark
|
bordercolorlight
|
cellpadding
|
cellspacing
|
cols
|
datapagesize
|
datasrc
|
frame
|
height
|
hspace
|
layout
|
rules
|
summary
|
vspace
|
width
|
Element-Specific Event Handler Attributes
Handler
|
NN
|
IE
|
HTML
|
onafterupdate
|
n/a
|
4
|
n/a
|
onbeforeupdate
|
n/a
|
4
|
n/a
|
onrowenter
|
n/a
|
4
|
n/a
|
onrowexit
|
n/a
|
4
|
n/a
|
align | NN all IE all HTML 3.2 |
Determines how the table is aligned relative to the next outermost
container (usually the document body or
html element). The align
attribute is deprecated in HTML 4 in favor of style sheet attributes.
Example
<table align="center">...</table>
Value
Alignment constant: center |
left | right.
Default
left
Object Model Reference
[window.]document.getElementById(elementID).align
background | NN 4 IE 3 HTML n/a |
Specifies an image file that is used as a backdrop to the table.
Unlike normal images that get loaded into browser content, a
background image loads in its original size (without scaling) and
tiles to fill the available table space. Smaller images download
faster but are obviously repeated more often in the background.
Animated GIFs are also allowable, but very distracting to the reader.
When selecting a background image, be sure it is very muted in
comparison to the main content so that the content stands out
clearly. Background images, if used at all, should be extremely
subtle.
Navigator 4 can be quirky with this attribute. Be prepared to wrap
your main table (without a background) inside another
table element, whose background
property has a graphic file assigned to it.
Example
<table background="watermark.jpg">...</table>
Value
Any valid URL to an image file, including complete and relative URLs.
Default
None (table is transparent).
Object Model Reference
[window.]document.getElementById(elementID).background
bgcolor | NN 3 IE 3 HTML 3.2 |
bgcolor="colorTripletOrName" | Optional | Establishes a fill color (behind the text and other content) for the
entire table. If you combine a bgcolor and
background, any transparent areas of the
background image let the background color show through. This
attribute is deprecated in HTML 4 in favor of the
background-color style attribute.
Example
<table bgcolor="tan">...</table>
Value
A hexadecimal triplet or plain-language color name. A setting of
empty is interpreted as "#000000" (black). See
Appendix A for acceptable plain-language color
names.
Default
Varies with browser, browser version, and operating system.
Object Model Reference
[window.]document.getElementById(elementID).bgColor
border | NN all IE all HTML 3.2 |
border="pixelCount" | Optional | The thickness (in pixels) of the border drawn around a
table element. If you set the
border attribute to any value, browsers by default
render narrow borders around each of the cells inside the table. With
a table element's border showing,
the thickness of internal borders between cells is defined by the
cellspacing attribute of the
table element.
If you include only the border attribute without
assigning any value to it, the browser renders default-sized borders
around the entire table and between cells, unless overridden by other
attributes.
Browsers render the border in a 3-D style, with the border appearing
to be raised around the flat content in the cells. Numerous other
attributes affect the look of the border, including:
bordercolor, bordercolordark,
bordercolorlight, frame, and
rules. The type of border rendered for tables is
different from the borders defined by style sheet rules. You get
better control of the border look by using the dedicated attributes
of the table element.
Example
<table border="1">...</table>
Value
A positive integer value.
Default
0
Object Model Reference
[window.]document.getElementById(elementID).border
bordercolor | NN 4 IE 3 HTML n/a |
bordercolor="colorTripletOrName" | Optional | The colors used to render some of the pixels that create the illusion
of borders around cells and the entire table. The
border attribute must have a nonzero value
assigned for the color to appear. The 3-D effect of borders in is
created by careful positioning of light (or white) and dark lines
around the page's background or default color (see
Figure 8-4). Standard colors are usually
shades of gray and white, depending on the browser.
Figure 8-4. Components of table border colorApplying color to a table border has a different effect in Navigator
and Internet Explorer. In Navigator, the color is applied to what is
normally the darker of the two shades used to create the border.
Moreover, Navigator automatically adjusts the darkness of some of the
lines to enhance the 3-D effect of the border. In contrast, Internet
Explorer applies the color to all lines that make up the border. The
net effect is to flatten the 3-D effect (refer to the
bordercolordark and
bordercolorlight attributes to color borders and
maintain the 3-D effect in IE).
Example
<table bordercolor="green" border="2">...</table>
Value
A hexadecimal triplet or plain-language color name. A setting of
empty is interpreted as "#000000" (black). See
Appendix A for acceptable plain-language color
names.
Default
Varies with browser and operating system.
Object Model Reference
[window.]document.getElementById(elementID).borderColor
bordercolordark, bordercolorlight | NN n/a IE 3 HTML n/a |
bordercolordark="colorTripletOrName"
bordercolorlight="colorTripletOrName" The 3-D effect of table borders in Internet Explorer is created by
careful positioning of light and dark lines around the
page's background or default color (see Figure 8-4). You can independently control the
colors used for the dark and light lines by assigning values to the
bordercolordark and
bordercolorlight attributes. The
border attribute must have a nonzero value
assigned for the colors to appear.
Typically, you should assign complementary colors to the pair of
attributes. There is also no rule that says you must assign a dark
color to bordercolordark. The attributes merely
control a well-defined set of lines so you can predict which lines of
the border change with each attribute.
To achieve the identical look in Navigator and IE, you must determine
the complementary colors that Navigator uses for its 3-D effect from
the bordercolor attribute. Then assign those
values to the bordercolordark and
bordercolorlight attributes. You may place all
three attributes in the same <table> tag.
Example
<table bordercolordark="darkred" bordercolorlight="salmon" border="3">...
</table>
Value
A hexadecimal triplet or plain-language color name. A setting of
empty is interpreted as "#000000" (black). See
Appendix A for acceptable plain-language color
names.
Default
Varies with operating system.
Object Model Reference
[window.]document.getElementById(elementID).borderColorDark
[window.]document.getElementById(elementID).borderColorLight
cellpadding | NN all IE 3 HTML 3.2 |
cellpadding="length" | Optional | The amount of empty space between the border of a table cell and the
content of the cell. Note that this attribute applies to space
inside a cell. Without setting this attribute,
most browsers render text content so that its leftmost pixels abut
the left edge of the cell. If the table displays borders, adding a
few pixels of breathing space between the border edge and the content
makes the content more readable. Large padding may also be desirable
in some design instances. This attribute is not as noticeable when
the table does not display borders (in which case the
cellspacing attribute can assist in adjusting the
space between cells).
Example
<table border="2" cellpadding="3">...</table>
Value
Any length value in pixels or percentage of available space.
Percentage values are based on the total available space in the
horizontal and vertical dimensions of the cell. For example, a value
of 10% means that the left and right padding will
each be 5% of the total width of the cell; the top and bottom padding
will each be 5% of the total height of the cell.
Default
0
Object Model Reference
[window.]document.getElementById(elementID).cellPadding
cellspacing | NN all IE 3 HTML 3.2 |
cellspacing="length" | Optional | The amount of empty space between the outer edges of each table cell.
If you set the border attribute of the
table element to any positive integer value, the
effect of setting cellspacing is to define the
thickness of borders rendered between cells. Even without a visible
border, the readability of a table often benefits from cell spacing.
Example
<table border="2" cellspacing="10">...</table>
Value
Any positive integer.
Default
0 (no table border); 2 (with
table border).
Object Model Reference
[window.]document.getElementById(elementID).cellSpacing
cols="columnCount" | Optional | The number of columns of the table. The HTML specification never
adopted this attribute. In HTML 4, the functionality of this
attribute is covered by the colgroup and
col elements. In the meantime, the
cols attribute is recognized by older and current
browsers. The attribute assists the browser in preparation for
rendering the table. Without this attribute, the browser relies on
its interpretation of all downloaded tr and
td elements to determine how the table is to be
divided.
Example
<table cols="4">...</table>
Value
Any positive integer.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).cols
datapagesize | NN n/a IE 4 HTML n/a |
datapagesize="recordCount" | Optional | Used with IE data binding, this attribute advises the browser how
many instances of a table row must be rendered to accommodate the
number of data source records set by this attribute. A common
application is setting a table cell to display a text
input element whose datafld
attribute is bound to a particular column of the data source (the
datasrc is set in the table
element). If the datapagesize attribute is set to
5, the browser must display five rows of the table (but the row is
specified in the HTML only once).
Example
<table datasrc="DBSRC3" datapagesize="5">
<tr>
<td><input type="text" datafld="stockNum"></td>
<td><input type="text" datafld="qtyOnHand"></td>
</tr>
</table>
Value
Any positive integer.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).dataPageSize
datasrc | NN n/a IE 4 HTML n/a |
datasrc="dataSourceName" | Optional | Used with IE data binding to specify the ID of the
page's object element that loads
the data source object for remote data access. Content from the data
source is specified via the datafld attribute.
A block of contiguous records can be rendered in the table when you
also set the datapagesize attribute of the table.
Works only with text file data sources in IE 5/Mac.
Example
<table datasrc="DBSRC3" datapagesize="5">...</table>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).dataSrc
frame="frameConstant" | Optional | Defines which (if any) sides of a table's outer
border (set with the border attribute) are
rendered. This attribute does not affect the interior borders between
cells. Including the border attribute without
assigning any value to it is the same as setting the
frame attribute to border. All
settings can be replicated with CSS border-related attributes if you
prefer.
Example
<table border="3" frame="void">...</table>
Value
Any one case-insensitive frame constant:
- above
-
Renders border along top edge of table only
- below
-
Renders border along bottom edge of table only
- border
-
Renders all four sides of the border (default in IE and NN)
- box
-
Renders all four sides of the border (same as border)
- hsides
-
Renders borders on top and bottom edges of table only (a nice look)
- lhs
-
Renders border on left edge of table only
- rhs
-
Renders border on right edge of table only
- void
-
Hides all borders (default in HTML 4)
- vsides
-
Renders borders on left and right edges of table only
Default
Navigator: void (when
border=0); border (when
border is any other value). Internet Explorer:
border.
Object Model Reference
[window.]document.getElementById(elementID).frame
height, width | NN all IE 3 HTML 3.2 (width) |
height="length"
width="length" The rectangular dimensions of a table that may be different from the
default size as calculated by the browser. When the values for these
attributes are less than the minimum space required to render the
table cell content, the browser overrides the attribute settings to
make sure that all content appears, even if it means that text lines
word-wrap. You can also stretch the dimensions of a table beyond the
browser-calculated dimensions. Extra whitespace appears inside table
cells to make up the difference. If you specify just one attribute,
the browser performs the necessary calculations to automatically
adjust the dimension along the other axis.
Note that the height attribute is not in the HTML
specification. The assumption there is that the table height is
calculated by the browser to best show all cell content given either
the default or attribute-established width. Because different
browsers on different operating systems can render text content in
varying relative font sizes, it is not unusual to let the height of a
table be calculated by the browser.
Example
<table width="80%">...</table>
Value
Any length value in pixels or percentage of available space.
Default
Governed by content, but width not to exceed 100%
of the next outermost container. IE does accept percentage values
beyond 100%, which may cause the
table's container to display scroll bars and perhaps
disturb the graphical integrity of the layout design.
Object Model Reference
[window.]document.getElementById(elementID).height
[window.]document.getElementById(elementID).width
hspace, vspace | NN 6 IE n/a HTML n/a |
hspace="pixels"
vspace="pixels" Inserts transparent padding outside the edges of the entire table on
the page. Use CSS-padding-related attributes instead. Note that
Netscape 6 responds to these table element
attributes only in "quirks" mode
(see DOCTYPE element).
Example
<table hspace="20" vspace="40">...</table>
Value
Integer pixel count.
Default
0
layout | NN 6 IE n/a HTML n/a |
layout="layoutType" | Optional | Controls the table-layout-rendering algorithm. A value of
fixed directs the browser to size the table and
cells according to explicit height and width settings, rather than
respecting content size minimums. This attribute mimics the
table-layout CSS attribute.
Example
<table layout="fixed" width="500">...</table>
Value
Constant values: auto | fixed.
Default
auto
rules="rulesConstant" | Optional | Defines where (if at all) interior borders between cells are rendered
by the browser. In addition to setting the table to draw borders to
turn the cells into a matrix, you can also set borders to be drawn
only to separate rows, columns, or any sanctioned cell grouping
(thead, tbody,
tfoot, colgroup, or
col). The border attribute must
be present—either as a Boolean or set to a specific border
size—for any cell borders to be drawn. IE 5/Mac leaves gaps in
inter-cell borders where rules are removed.
Example
<table border="3" rules="groups">...</table>
Value
Any one case-insensitive rules constant:
- all
-
Renders borders around each cell
- cols
-
Renders borders between columns only
- groups
-
Renders borders between cell groups as defined by the
thead, tfoot,
tbody, colgroup, or
col elements
- none
-
Hides all interior borders
- rows
-
Renders borders between rows only
Default
none (when border=0);
all (when border is any other
value).
Object Model Reference
[window.]document.getElementById(elementID).rules
A textual description of the table, including, but not limited to,
instructions that nonvisual browsers might follow to describe the
purpose and organization of the table data. The Properties choice for Netscape
6's context menu for this element displays a small
window that includes an active link to the URL assigned to the
attribute. Version 6 browsers provide no other functionality for this
attribute.
Example
<table summary="Order form for entry of up to five products.">...</table>
Value
Any quoted string of characters.
Default
None.
See hspace.
See height.
<tbody>...</tbody> | HTML End Tag: Optional | A tbody element is an arbitrary container of one
or more rows of table cells. More than one tbody
element may be defined within a single table
element. Use the tbody element to define
structural segments of a table that may require their own styles or
border treatments (see the rules attribute). A
tbody element is the row-oriented equivalent of
the colgroup element for columns. Other types of
row groupings available are the tfoot and
thead elements, neither of which overlaps with a
tbody element.
Example
<table cols="3">
<thead>
<tr>
<th>Time</th><th>Event</th><th>Location</th>
</tr>
</thead>
<tbody>
<tr>
<td>7:30am-5:00pm</td><td>Registration Open</td><td>Main Lobby</td>
</tr>
<tr>
<td>9:00am-12:00pm</td><td>Keynote Speakers</td><td>Cypress Room</td>
</tr>
</tbody>
</table>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
align
|
bgcolor
|
ch
|
char
|
charoff
|
choff
|
valign
|
|
|
|
Element-Specific Event Handler Attributes
None.
align="alignConstant" | Optional | Establishes the horizontal alignment characteristics of content
within the row(s) covered by the tbody element.
Example
<tbody align="center">
Value
HTML 4 and various browsers implement different sets of attribute
values.
Value
|
IE/Windows
|
IE/Mac and NN 6
|
HTML 4
|
center
|
•
|
•
|
•
|
char
|
-
|
-
|
•
|
justify
|
-
|
•
|
•
|
left
|
•
|
•
|
•
|
right
|
•
|
•
|
•
|
The values center, left, and
right are self-explanatory. The value
justify spaces multiline content so that text is
justified down both left and right edges. For the value
char, the char attribute must
also be set to specify the character on which alignment revolves. In
the HTML 4 specification example, content that does not contain the
character appears to be right-aligned to the location of the
character in other rows of the same column.
It's important to bear in mind that the
align attribute applies to every cell of every row
within the tbody, including any
th element you specify for the table. If you want
a different alignment for the row header, override the setting with a
separate align attribute or
text-align style sheet attribute for the
thead or individual th
elements.
Default
left
Object Model Reference
[window.]document.getElementById(elementID).align
bgcolor | NN 6 IE 4 HTML n/a |
bgcolor="colorTripletOrName" | Optional | Establishes a fill color (behind the text and other content) for the
cells contained by the tbody element.
Example
<tbody bgcolor="tan">
Value
A hexadecimal triplet or plain-language color name. A setting of
empty is interpreted as "#000000" (black). See
Appendix A for acceptable plain-language color
names.
Default
Varies with browser, browser version, and operating system.
Object Model Reference
[window.]document.getElementById(elementID).bgColor
The char attribute defines the text character used
as an alignment point for text within a cell contained by the
tbody element. This attribute is of value only for
the align attribute set to
"char". Microsoft documents a
ch attribute, which corresponds to the
standards-based char attribute. In any case, the
browser does not respond to either attribute. Netscape 7 has not yet
connected support for the char attribute.
Example
<tbody align="char" char=".">
Value
Any single text character.
Default
None.
charoff | NN 6 IE n/a HTML 4 |
The charoff attribute lets you set a specific
offset point at which the character specified by the
char attribute is to appear within a cell
contained by the tbody element. This attribute is
provided in case the browser default positioning does not meet with
the design goals of the table. Microsoft documents a
choff attribute, which corresponds to the
standards-based charoff attribute. In any case,
the browser does not respond to either attribute. Netscape 7 has not
yet connected support for the charoff attribute.
Example
<tbody align="char" char="." charoff="80%">
Value
Any length value in pixels or percentage of cell space.
Default
None.
See charoff.
valign="alignmentConstant" | Optional | Determines the vertical alignment of content within cells of the
column(s) covered by the tbody element. You can
override the vertical alignment for a particular cell anywhere in the
column.
Example
<tbody valign="bottom">
Value
Four constant values: top |
middle | bottom |
baseline. With top and
bottom, the content is rendered flush (or very
close to it) to the top and bottom of the table cell. Set to
middle (the default), the content floats perfectly
centered vertically in the cell. When one cell's
contents might wrap to multiple lines at common window widths
(assuming a variable table width), it is advisable to set the
valign attribute to baseline.
This assures that the character baseline of the first (or only) line
of a cell's text aligns with the other cells in the
row—usually the most aesthetically pleasing arrangement.
Default
middle
Object Model Reference
[window.]document.getElementById(elementID).vAlign
<td> | NN all IE all HTML 3.2 |
<td>...</td> | End Tag: Optional | The td element is a container for content that is
rendered inside one cell of a table element. One
cell is the intersection of a column and row. Other elements related
to the td element are caption,
col, colgroup,
table, tbody,
tfoot, th,
thead, and tr. In addition to
providing a wrapper for a cell's content, the
td element defines a number of visible attributes
that apply to a single cell, often overriding similar attributes set
in lesser-nested elements in the table.
Four attributes—abbr,
axis, headers, and
scope—are included in the HTML 4
specification in anticipation of nonvisual browsers that will use
text-to-speech technology to describe content of an HTML page—a
kind of "verbal rendering."
Although these attributes are briefly described here for the sake of
completeness, there is much more to their application in nonvisual
browsers than is relevant in this book on Dynamic HTML. Consult the
HTML 4 recommendation for more details.
Example
<table cols="3">
<thead>
<tr>
<th>Time</th><th>Event</th><th>Location</th>
</tr>
</thead>
<tbody>
<tr>
<td>7:30am-5:00pm</td><td>Registration Open</td><td>Main Lobby</td>
</tr>
<tr>
<td>9:00am-12:00pm</td><td>Keynote Speakers</td><td>Cypress Room</td>
</tr>
</tbody>
</table>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
abbr
|
align
|
axis
|
background
|
bgcolor
|
bordercolor
|
bordercolordark
|
bordercolorlight
|
ch
|
char
|
charoff
|
choff
|
colspan
|
datafld
|
dir
|
headers
|
height
|
nowrap
|
rowspan
|
scope
|
valign
|
width
|
|
|
|
Element-Specific Event Handler Attributes
Handler
|
NN
|
IE
|
HTML
|
onafterupdate
|
n/a
|
4
|
n/a
|
onbeforeupdate
|
n/a
|
4
|
n/a
|
onrowenter
|
n/a
|
4
|
n/a
|
onrowexit
|
n/a
|
4
|
n/a
|
Provides an abbreviated string that describes the
cell's content. This is usually a brief label that a
nonvisual browser would speak to describe what the value of the cell
represents. The Properties choice
for Netscape 6's context menu for this element
displays a small window that includes an active link to the URL
assigned to the attribute. Version 6 browsers provide no other
functionality for this attribute.
Example
<td abbr="Main Event">Keynote Speakers</td>
Value
Any quoted string.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).abbr
align | NN all IE all HTML 3.2 |
align="alignConstant" | Optional | Establishes the horizontal alignment characteristics of content
within the cell covered by the td element.
Example
<td align="center">
Value
HTML 4 and various browsers implement different sets of attribute
values.
Value
|
IE/Windows and NN 4
|
IE/Mac and NN 6
|
HTML 4
|
center
|
•
|
•
|
•
|
char
|
-
|
-
|
•
|
justify
|
-
|
•
|
•
|
left
|
•
|
•
|
•
|
right
|
•
|
•
|
•
|
The values center, left, and
right are self-explanatory. The value
justify spaces multiline content so that text is
justified down both left and right edges. For the value
char, the char attribute must
also be set to specify the character on which alignment revolves. In
the HTML 4 specification example, content that does not contain the
character appears to be right-aligned to the location of the
character in other rows of the same column.
Default
left
Object Model Reference
[window.]document.getElementById(elementID).align
Provides an abbreviated string that describes the
cell's category. This is usually a brief label that
a nonvisual browser would speak to describe what the value of the
cell represents. The Properties
choice for Netscape 6's context menu for this
element displays a small window that includes an active link to the
URL assigned to the attribute. Version 6 browsers provide no other
functionality for this attribute.
Example
<td axis="event">Keynote Speakers</td>
Value
Any quoted string.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).axis
background | NN 4 IE 3 HTML n/a |
Specifies an image file that is used as a backdrop to the cell.
Unlike normal images that get loaded into browser content, a
background image loads in its original size (without scaling) and
tiles to fill the available cell space. Smaller images download
faster but are obviously repeated more often in the background.
Navigator 4, however, requires a minimum image size of 16 by 16
pixels. Animated GIFs are also allowable, but very distracting to the
reader. When selecting a background image, be sure it is very muted
in comparison to the main content so that the content stands out
clearly. Background images, if used at all, should be extremely
subtle.
Example
<td background="watermark.jpg">
Value
Any valid URL to an image file, including complete and relative URLs.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).background
bgcolor | NN 3 IE 3 HTML 3.2 |
bgcolor="colorTripletOrName" | Optional | Establishes a fill color (behind the text and other content) for the
cell defined by the td element.
Example
<td bgcolor="yellow">
Value
A hexadecimal triplet or plain-language color name. A setting of
empty is interpreted as "#000000" (black). See
Appendix A for acceptable plain-language color
names.
Default
Varies with browser, browser version, and operating system.
Object Model Reference
[window.]document.getElementById(elementID).bgColor
bordercolor | NN n/a IE 3 HTML n/a |
bordercolor="colorTripletOrName" | Optional | The colors used to render some of the pixels that create the illusion
of borders around cells and the entire table. Internet Explorer
applies the color to all four lines that make up the interior border
of a cell. Therefore, colors of adjacent cells do not collide.
Example
<td bordercolor="green">
Value
A hexadecimal triplet or plain-language color name. A setting of
empty is interpreted as "#000000" (black). See
Appendix A for acceptable plain-language color
names.
Default
Varies with browser and operating system.
Object Model Reference
[window.]document.getElementById(elementID).borderColor
bordercolordark, bordercolorlight | NN n/a IE 3 HTML n/a |
bordercolordark="colorTripletOrName"
bordercolorlight="colorTripletOrName" The 3-D effect of table borders in Internet Explorer is created by
careful positioning of light and dark lines around the
page's background or default color (see Figure 8-4 in the table element discussion). You can
independently control the colors used for the dark and light lines by
assigning values to the bordercolordark (left and
top edges of the cell) and bordercolorlight (right
and bottom edges) attributes.
Typically, you should assign complementary colors to the pair of
attributes. There is also no rule that says you must assign a dark
color to bordercolordark. The attributes merely
control a well-defined set of lines so you can predict which lines of
the border change with each attribute.
Example
<td bordercolordark="darkred" bordercolorlight="salmon">
Value
A hexadecimal triplet or plain-language color name. A setting of
empty is interpreted as "#000000" (black). See
Appendix A for acceptable plain-language color
names.
Default
Varies with operating system.
Object Model Reference
[window.]document.getElementById(elementID).borderColorDark
[window.]document.getElementById(elementID).borderColorLight
The char attribute defines the text character used
as an alignment point for text within a cell. This attribute is of
value only for the align attribute set to
"char". Microsoft documents a
ch attribute, which corresponds to the
standards-based char attribute. In any case, the
browser does not respond to either attribute. Netscape 7 has not yet
connected support for the char attribute.
Example
<td align="char" char=".">203.00</td>
Value
Any single text character.
Default
None.
charoff | NN 6 IE n/a HTML 4 |
The charoff attribute lets you set a specific
offset point at which the character specified by the
char attribute is to appear within a cell. This
attribute is provided in case the browser default positioning does
not meet with the design goals of the table. Microsoft documents a
choff attribute, which corresponds to the
standards-based charoff attribute. In any case,
the browser does not respond to either attribute. Netscape 7 has not
yet connected support for the charoff attribute.
Example
<td align="char" char="." charoff="80%">
Value
Any length value in pixels or percentage of cell space.
Default
None.
See charoff.
colspan | NN all IE all HTML 3.2 |
colspan="columnCount" | Optional | The number of columns across which the current table cell should
extend itself. For each additional column included in the
colspan count, one less td
element is required for the table row. If you set the
align attribute to center or
right, the alignment is calculated on the full
width of the td element across the specified
number of columns. Unless the current cell also specifies a
rowspan attribute, the next table row returns to
the original column count.
Example
<td colspan="2" align="center">
Value
Any positive integer, usually 2 or larger.
Default
1
Object Model Reference
[window.]document.getElementById(elementID).colSpan
datafld | NN n/a IE 4 HTML n/a |
datafld="columnName" | Optional | Used with IE data binding to associate a remote data source column
name with the content of a table cell. A datasrc
(and optionally a datapagesize) attribute must
also be set for the enclosing table element. Works
only with text file data sources in IE 5/Mac.
Example
<table datasrc="DBSRC3" datapagesize="5">
<tr>
<td datafld="stockNum"></td>
<td datafld="qtyOnHand"></td>
</tr>
</table>
Value
Case-sensitive identifier.
Default
None.
headers="cellIDList" | Optional | Points to one or more th or td
elements that act as column or row headers for the current table
cell. The assigned value is a space-delimited list of
id attribute values that are assigned to the
relevant th elements. A nonvisual browser could
speak the cell's header before the content of the
cell to help listeners identify the nature of the cell content.
Although maintstream Version 6 browsers claim support for this
attribute, neither have yet connected support for it.
Example
<tr>
<th id="hdr1">Product Number</th>
<th id="hdr2">Description</th>
</tr>
<tr>
<td headers="hdr1">0392</td>
<td headers="hdr2">Round widget</td>
</tr>
Value
A space-delimited list of case-sensitive IDs assigned to cells that
act as headers to the current cell.
Default
None.
height, width | NN all IE all HTML 3.2 |
height="length"
width="length" The rectangular dimensions of a cell that may be different from the
default size as calculated by the browser. When the values for these
attributes are less than the minimum space required to render the
table cell content, the browser overrides the attribute settings to
make sure that all content appears, even if it means that text lines
word-wrap. You can also stretch the dimensions of a table beyond the
browser-calculated dimensions. Extra whitespace appears inside table
cells to make up the difference. If you specify just one of these
attributes, the browser performs all necessary calculations to
automatically adjust the dimension along the other axis. The cell
must have some content assigned to it, or it may close up to minimum
size.
Due to the regular nature of tables, if you set a custom height for
one cell in a row, the entire row is set to that height; similarly,
setting the width of a cell causes the width of all cells in the
column to be the same size.
Both the height and width
attributes are deprecated in HTML 4 in favor of
height and width style sheet
attributes (which are not available for table cells in Navigator 4).
Example
<td width="80%" height="30">
Value
Any length value in pixels or percentage of available space.
Default
Based on content size.
Object Model Reference
[window.]document.getElementById(elementID).height
[window.]document.getElementById(elementID).width
nowrap | NN all IE all HTML 3.2 |
The presence of the nowrap attribute instructs the
browser to render the cell as wide as is necessary to display a line
of nonbreaking text on one line. Abuse of this attribute can force
the user into a great deal of inconvenient horizontal scrolling of
the page to view all of the content. The nowrap
attribute is deprecated in HTML 4 in favor of the
white-space:nowrap CSS attribute and value.
Example
<td nowrap>
Value
The presence of this attribute sets its value to
true.
Default
false
Object Model Reference
[window.]document.getElementById(elementID).noWrap
rowspan | NN all IE all HTML 3.2 |
rowspan="rowCount" | Optional | The number of rows through which the current table cell should extend
itself downward. For each additional row included in the
rowspan count, one less td
element is required for the next table row in that
cell's position along the row.
Example
<td rowspan="2">
Value
Any positive integer, usually 2 or larger.
Default
1
Object Model Reference
[window.]document.getElementById(elementID).rowSpan
scope="scopeConstant" | Optional | Used more with a th element than with a
td element, the scope attribute
sets the range of cells (relative to the current cell) that behave as
though the current cell is the header for those cells. For tables
whose structure is quite regular, the scope
attribute is a simpler way of achieving what the
headers attribute does, without having to define
id attributes for the header cells. Although
maintstream Version 6 browsers claim support for this attribute,
neither have yet connected support for it.
Example
<tr>
<th scope="col">Product Number</th>
<th scope="col">Description</th>
</tr>
<tr>
<td>0392</td>
<td>Round widget</td>
</tr>
Value
One of four recognized scope constants:
- col
-
Current cell text becomes header text for every cell in the rest of
the column.
- colgroup
-
Current cell text becomes header text for every cell in the rest of
the colgroup element.
- row
-
Current cell text becomes header text for every cell in the rest of
the tr element.
- rowgroup
-
Current cell text becomes header text for every cell in the rest of
the tbody element.
Default
None.
valign | NN all IE all HTML 3.2 |
valign="alignmentConstant" | Optional | Determines the vertical alignment of content within the
td element. A value you set for an individual cell
overrides the same attribute setting for outer containers, such as
tr and tbody.
Example
<td valign="bottom">
Value
Four constant values: top |
middle | bottom |
baseline. With top and
bottom, the content is rendered flush (or very
close to it) to the top and bottom of the table cell. Set to
middle (the default), the content floats perfectly
centered vertically in the cell. When one cell's
contents might wrap to multiple lines at common window widths
(assuming a variable table width), it is advisable to set the
valign attribute to baseline.
This assures that the character baseline of the first (or only) line
of a cell's text aligns with the other cells in the
row—usually the most aesthetically pleasing arrangement.
Default
middle
Object Model Reference
[window.]document.getElementById(elementID).vAlign
See height.
<textarea> | NN all IE all HTML all |
<textarea>...</textarea> | HTML End Tag: Required | The textarea element is a multiline text input
control primarily used inside form elements
(required in Navigator 4 or earlier). Unlike the text type
input element, a textarea
element can be sized to accept more than one line of text.
Word-wrapping is available on more recent browsers, and users may
enter carriage return characters (a combination of characters ASCII
decimal 13 and 10) inside the text box. When a
textarea element is inside a submitted form, the
name/value pair is submitted, with the value being the content of the
text box (and the name attribute must be
assigned). The CGI program on the server must be able to handle the
possibility of carriage returns in the text data.
If you wish to display text in the textarea
element when it loads, that text goes between the start and end tags;
otherwise, there are no intervening characters in the source code
between start and end tags. A label for the
textarea element must be placed before or after
the element, and may be encased in a label element
for structural purposes (optionally in newer browsers).
Example
<textarea rows="5" cols="60" name="notes">Use this area for extra notes.
</textarea>
Object Model Reference
[window.]document.formName.elementName
[window.]document.forms[i].elements[j]
[window.]document.getElementById(elementID)
Element-Specific Attributes
cols
|
datafld
|
datasrc
|
disabled
|
name
|
readonly
|
rows
|
wrap
|
|
|
Element-Specific Event Handler Attributes
Handler
|
NN
|
IE
|
HTML
|
onafterupdate
|
n/a
|
4
|
n/a
|
onbeforeupdate
|
n/a
|
4
|
n/a
|
onchange
|
2
|
3
|
4
|
onscroll
|
n/a
|
3
|
4
|
onselect
|
2
|
3
|
4
|
cols | NN all IE all HTML all |
cols="columnCount" | Optional | The width of the editable space of the textarea
element. The value represents the number of monofont characters that
are to be displayed within the width. For a browser that supports
style sheet font sizes, the actual width changes accordingly.
Example
<textarea cols="40">...</textarea>
Value
Any positive integer.
Default
Varies with browser and operating system.
Object Model Reference
[window.]document.formName.elementName.cols
[window.]document.forms[i].elements[j].cols
[window.]document.getElementById(elementID).cols
datafld | NN n/a IE 4 HTML n/a |
datafld="columnName" | Optional | Used with IE data binding to associate a remote data source column
name with the content of the textarea element. A
datasrc attribute must also be set for the
element. Works only with text file data sources in IE 5/Mac.
Example
<textarea name="summary" datasrc="DBSRC3" datafld="summary"></textarea>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.formName.elementName.dataFld
[window.]document.forms[i].elements[j].dataFld
[window.]document.getElementById(elementID).dataFld
datasrc | NN n/a IE 4 HTML n/a |
datasrc="dataSourceName" | Optional | Used with IE data binding to specify the ID of the
page's object element that loads
the data source object for remote data access. Content from the data
source is specified via the datafld attribute.
Works only with text file data sources in IE 5/Mac.
Example
<textarea name="summary" datasrc="DBSRC3" datafld="summary"></textarea>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.formName.elementName.dataSrc
[window.]document.forms[i].elements[j].dataSrc
[window.]document.getElementById(elementID).dataSrc
A disabled textarea element can't
be activated by the user. In IE/Windows and Netscape 6, a disabled
textarea cannot receive focus and
doesn't become active within the tabbing order
rotation. The name/value pair of a disabled element is not sent when
the form is submitted.
The disabled attribute is a Boolean type, which
means that its presence in the attribute sets its value to
true. Its value can also be adjusted after the
fact by scripting (see the textarea object in
Chapter 9).
Example
<textarea disabled></textarea>
Value
The presence of the attribute disables the element.
Default
false
Object Model Reference
[window.]document.formName.elementName.disabled
[window.]document.forms[i].elements[j].disabled
[window.]document.getElementById(elementID).disabled
name | NN all IE all HTML all |
name="elementIdentifier" | Optional | If the textarea element is part of a form being
submitted to a server, the name attribute is
required if the value of the element is to be submitted with the
form. For forms that are in documents for the convenience of scripted
form elements, textarea element names are not
required but are helpful just the same in creating scripted
references to these objects and their properties or methods. Newer
DOMs encourage assigning the same identifier to the
id attribute for uniform script references to the
element object.
Example
<textarea name="comments" id="comments"></textarea>
Value
Case-sensitive identifier.
Default
None.
Object Model Reference
[window.]document.formName.elementName.name
[window.]document.forms[i].elements[j].name
[window.]document.getElementById(elementID).name
When the readonly attribute is present, the
textarea element cannot be edited on the page by
the user (although scripts can modify the content). A
textarea marked as readonly
should not receive focus within the tabbing order (although IE for
the Macintosh allows the field to receive focus). Users can still
select and copy text from a read-only textarea.
Example
<textarea name="instructions" readonly></textarea>
Value
The presence of the attribute sets its value to
true.
Default
false
Object Model Reference
[window.]document.formName.elementName.readOnly
[window.]document.forms[i].elements[j].readOnly
[window.]document.getElementById(elementID).readOnly
rows | NN all IE all HTML all |
The height of the textarea element based on the
number of lines of text that are to be displayed without scrolling.
The value represents the number of monospace-font character lines
that are to be displayed within the height before the scrollbar
becomes active. For a browser that supports style sheet font sizes,
the actual width changes accordingly.
Example
<textarea rows="5" cols="40"></textarea>
Value
Any positive integer.
Default
Varies with browser and operating system.
Object Model Reference
[window.]document.formName.elementName.rows
[window.]document.forms[i].elements[j].rows
[window.]document.getElementById(elementID).rows
The wrap attribute tells the browser whether it
should wrap text in a textarea element and whether
wrapped text should be submitted to the server with soft returns
converted to hard carriage returns. The HTML specification is silent
on the subject, while Navigator and IE have, over the years, clouded
the attribute values. But more recently, the mainstream browsers are
coming together on a set of three attribute values:
off, soft, and
hard.
When set to soft, the text automatically wraps as
the user types, but the carriage returns and line feeds (CRLFs) do
not go with the text when the form is submitted. With a setting of
hard, wrapping occurs, and the CRLFs introduced by
wrapping become part of the
textarea's value submitted to the
server. Old synonyms for the soft value include
virtual and physical. A setting
of off means that typing beyond the right edge of
the rectangle forces the textarea to scroll
horizontally. Only a press of the Return key causes the text
insertion pointer to advance to the next line.
Example
<textarea name="comments" wrap="hard"></textarea>
Value
Constant values: hard | off |
soft.
Default
soft
Object Model Reference
[window.]document.formName.elementName.wrap
[window.]document.forms[i].elements[j].wrap
[window.]document.getElementById(elementID).wrap
<tfoot>...</tfoot> | HTML End Tag: Optional | A tfoot element is a special-purpose container of
one or more rows of table cells rendered at the bottom of the table.
Typically, the tfoot element mirrors the
thead element content for users who have scrolled
down the page (or for future browsers that scroll inner table
content). No more than one tfoot element may be
defined within a single table element, and the
tfoot element should be located in the source code
before any tbody elements
defined for the table. A tfoot element is a row
grouping, like the tbody and
thead elements. Navigator 4 ignores the
tfoot tag and therefore renders the nested
tr element(s) as regular tr
elements in source code order.
Example
<table cols="3">
<thead>
<tr>
<th>Time</th><th>Event</th><th>Location</th>
</tr>
</thead>
<tfoot>
<tr>
<th>Time</th><th>Event</th><th>Location</th>
</tr>
</tfoot>
<tbody>
<tr>
<td>7:30am-5:00pm</td><td>Registration Open</td><td>Main Lobby</td>
</tr>
<tr>
<td>9:00am-12:00pm</td><td>Keynote Speakers</td><td>Cypress Room</td>
</tr>
</tbody>
</table>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
align
|
bgcolor
|
ch
|
char
|
charoff
|
choff
|
valign
|
|
|
|
Element-Specific Event Handler Attributes
None.
align="alignConstant" | Optional | Establishes the horizontal alignment characteristics of content
within the row(s) covered by the tfoot element.
Example
<tfoot align="center">
Value
HTML 4 and various browsers implement different sets of attribute
values.
Value
|
IE/Windows
|
IE/Mac and NN 6
|
HTML 4
|
center
|
•
|
•
|
•
|
char
|
-
|
-
|
•
|
justify
|
-
|
•
|
•
|
left
|
•
|
•
|
•
|
right
|
•
|
•
|
•
|
The values center, left, and
right are self-explanatory. The value
justify spaces multiline content so that text is
justified down both left and right edges. For the value
char, the char attribute must
also be set to specify the character on which alignment revolves. In
the HTML 4 specification example, content that does not contain the
character appears to be right-aligned to the location of the
character in other rows of the same column.
It's important to bear in mind that the
align attribute applies to every cell of every row
within the tfoot, including any
th element you specify for the table. If you want
a different alignment for the row header, override the setting with a
separate align attribute or
text-align style sheet attribute for the
individual th elements.
Default
left
Object Model Reference
[window.]document.getElementById(elementID).align
bgcolor | NN 6 IE 4 HTML n/a |
bgcolor="colorTripletOrName" | Optional | Establishes a fill color (behind the text and other content) for the
cells contained by the tfoot element.
Example
<tfoot bgcolor="tan">
Value
A hexadecimal triplet or plain-language color name. A setting of
empty is interpreted as "#000000" (black). See
Appendix A for acceptable plain-language color
names.
Default
Varies with browser, browser version, and operating system.
Object Model Reference
[window.]document.getElementById(elementID).bgColor
The char attribute defines the text character used
as an alignment point for text within a cell contained by the
tfoot element. This attribute is of value only for
the align attribute set to
"char". Microsoft documents a
ch attribute, which corresponds to the
standards-based char attribute. In any case, the
browser does not respond to either attribute. Netscape 7 has not yet
connected support for the char attribute.
Example
<tfoot align="char" char=".">
Value
Any single text character.
Default
None.
charoff | NN 6 IE n/a HTML 4 |
The charoff attribute lets you set a specific
offset point at which the character specified by the
char attribute is to appear within a cell
contained by the tfoot element. This attribute is
provided in case the browser default positioning does not meet with
the design goals of the table. Microsoft documents a
choff attribute, which corresponds to the
standards-based charoff attribute. In any case,
the browser does not respond to either attribute. Netscape 7 has not
yet connected support for the charoff attribute.
Example
<tfoot align="char" char="." charoff="80%">
Value
Any length value in pixels or percentage of cell space.
Default
None.
See charoff.
valign="alignmentConstant" | Optional | Determines the vertical alignment of content within cells of the
column(s) covered by the tfoot element. You can
override the vertical alignment for a particular cell anywhere in the
column.
Example
<tfoot valign="bottom">
Value
Four constant values: top |
middle | bottom |
baseline. With top and
bottom, the content is rendered flush (or very
close to it) to the top and bottom of the table cell. Set to
middle (the default), the content floats perfectly
centered vertically in the cell. When one cell's
contents might wrap to multiple lines at common window widths
(assuming a variable table width), it is advisable to set the
valign attribute to baseline.
This assures that the character baseline of the first (or only) line
of a cell's text aligns with the other cells in the
row—usually the most aesthetically pleasing arrangement.
Default
middle
Object Model Reference
[window.]document.getElementById(elementID).vAlign
<th> | NN all IE all HTML 3.2 |
<th>...</th> | HTML End Tag: Optional | The th element is a container for content that is
rendered inside one cell of a table element in a
format that distinguishes it as a header. Most browsers render the
content as boldface. A cell is the intersection of a column and row.
Other elements related to the th element are
caption, col,
colgroup, table,
tbody, td,
tfoot, thead, and
tr. In addition to providing a wrapper for a
cell's content, the th element
defines a number of visible attributes that apply to a single cell,
often overriding similar attributes set in lesser-nested elements in
the table.
Four attributes—abbr,
axis, headers, and
scope—are included in the HTML 4
specification in anticipation of nonvisual browsers that will use
text-to-speech technology to describe content of an HTML page—a
kind of "verbal rendering."
Although these attributes are briefly described here for the sake of
completeness, there is much more to their application in nonvisual
browsers than is relevant in this book on Dynamic HTML. Consult the
HTML 4 recommendation for more details.
Example
<table cols="3">
<thead>
<tr>
<th>Time</th><th>Event</th><th>Location</th>
</tr>
</thead>
<tbody>
<tr>
<td>7:30am-5:00pm</td><td>Registration Open</td><td>Main Lobby</td>
</tr>
<tr>
<td>9:00am-12:00pm</td><td>Keynote Speakers</td><td>Cypress Room</td>
</tr>
</tbody>
</table>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
abbr
|
align
|
axis
|
background
|
bgcolor
|
bordercolor
|
bordercolordark
|
bordercolorlight
|
ch
|
char
|
charoff
|
choff
|
colspan
|
datafld
|
headers
|
height
|
nowrap
|
rowspan
|
scope
|
valign
|
width
|
|
|
|
|
Element-Specific Event Handler Attributes
Handler
|
NN
|
IE
|
HTML
|
onafterupdate
|
n/a
|
4
|
n/a
|
onbeforeupdate
|
n/a
|
4
|
n/a
|
onrowenter
|
n/a
|
4
|
n/a
|
onrowexit
|
n/a
|
4
|
n/a
|
Provides an abbreviated string that describes the
cell's content. This is usually a brief label that a
nonvisual browser would speak to describe what the value of the cell
represents. The Properties choice
for Netscape 6's context menu for this element
displays a small window that includes an active link to the URL
assigned to the attribute. Version 6 browsers provide no other
functionality for this attribute.
Example
<th abbr="What">Event</th>
Value
Any quoted string.
Default
None.
align | NN all IE all HTML 3.2 |
align="alignConstant" | Optional | Establishes the horizontal alignment characteristics of content
within the cell covered by the th element.
Example
<th align="center">
Value
HTML 4 and various browsers implement different sets of attribute
values.
Value
|
IE/Windows and NN 4
|
IE/Mac and NN 6
|
HTML 4
|
center
|
•
|
•
|
•
|
char
|
-
|
-
|
•
|
justify
|
-
|
•
|
•
|
left
|
•
|
•
|
•
|
right
|
•
|
•
|
•
|
The values center, left, and
right are self-explanatory. The value
justify spaces multi-line content so that text is
justified down both left and right edges. For the value
char, the char attribute must
also be set to specify the character on which alignment revolves. In
the HTML 4 specification example, content that does not contain the
character appears to be right-aligned to the location of the
character in other rows of the same column.
Default
left
Object Model Reference
[window.]document.getElementById(elementID).align
Provides an abbreviated string that describes the
cell's category. This is usually a brief label that
a nonvisual browser would speak to describe what the value of the
cell represents. The Properties
choice for Netscape 6's context menu for this
element displays a small window that includes an active link to the
URL assigned to the attribute. Version 6 browsers provide no other
functionality for this attribute.
Example
<th axis="event">Events</th>
Value
Any quoted string.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).axis
background | NN 4 IE 3 HTML n/a |
Specifies an image file that is used as a backdrop to the cell.
Unlike normal images that get loaded into browser content, a
background image loads in its original size (without scaling) and
tiles to fill the available cell space. Smaller images download
faster but are obviously repeated more often in the background.
Navigator 4, however, requires a minimum image size of 16 by 16
pixels. Animated GIFs are also allowable, but very distracting to the
reader. When selecting a background image, be sure it is very muted
in comparison to the main content so that the content stands out
clearly. Background images, if used at all, should be extremely
subtle.
Example
<th background="watermark.jpg">
Value
Any valid URL to an image file, including complete and relative URLs.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).background
bgcolor | NN 3 IE 3 HTML 3.2 |
bgcolor="colorTripletOrName" | Optional | Establishes a fill color (behind the text and other content) for the
cell defined by the th element.
Example
<th bgcolor="yellow">
Value
A hexadecimal triplet or plain-language color name. A setting of
empty is interpreted as "#000000" (black). See
Appendix A for acceptable plain-language color
names.
Default
Varies with browser, browser version, and operating system.
Object Model Reference
[window.]document.getElementById(elementID).bgColor
bordercolor | NN n/a IE 3 HTML n/a |
bordercolor="colorTripletOrName" | Optional | The colors used to render some of the pixels that create the illusion
of borders around cells and the entire table. Internet Explorer
applies the color to all four lines that make up the interior border
of a cell. Therefore, colors of adjacent cells do not collide.
Example
<th bordercolor="green">
Value
A hexadecimal triplet or plain-language color name. A setting of
empty is interpreted as "#000000" (black). See
Appendix A for acceptable plain-language color
names.
Default
Varies with browser and operating system.
Object Model Reference
[window.]document.getElementById(elementID).borderColor
bordercolordark, bordercolorlight | NN n/a IE 3 HTML n/a |
bordercolordark="colorTripletOrName"
bordercolorlight="colorTripletOrName" The 3-D effect of table borders in Internet Explorer is created by
careful positioning of light and dark lines around the
page's background or default color (see Figure 8-4 in the table element
discussion). You can independently control the colors used for the
dark and light lines by assigning values to the
bordercolordark (left and top edges of the cell)
and bordercolorlight (right and bottom edges)
attributes.
Typically, you should assign complementary colors to the pair of
attributes. There is also no rule that says you must assign a dark
color to bordercolordark. The attributes merely
control a well-defined set of lines so you can predict which lines of
the border change with each attribute.
Example
<th bordercolordark="darkred" bordercolorlight="salmon">
Value
A hexadecimal triplet or plain-language color name. A setting of
empty is interpreted as "#000000" (black). See
Appendix A for acceptable plain-language color
names.
Default
Varies with operating system.
Object Model Reference
[window.]document.getElementById(elementID).borderColorDark
[window.]document.getElementById(elementID).borderColorLight
The char attribute defines the text character used
as an alignment point for text within a cell. This attribute is of
value only for the align attribute set to
"char". Microsoft documents a
ch attribute, which corresponds to the
standards-based char attribute. In any case, the
browser does not respond to either attribute. Netscape 7 has not yet
connected support for the char attribute.
Example
<th align="char" char=".">$325.10</th>
Value
Any single text character.
Default
None.
charoff | NN 6 IE n/a HTML 4 |
The charoff attribute lets you set a specific
offset point at which the character specified by the
char attribute is to appear within a cell. This
attribute is provided in case the browser default positioning does
not meet with the design goals of the table. Microsoft documents a
choff attribute, which corresponds to the
standards-based charoff attribute. In any case,
the browser does not respond to either attribute. Netscape 7 has not
yet connected support for the charoff attribute.
Example
<th align="char" char="." charoff="80%">
Value
Any length value in pixels or percentage of cell space.
Default
None.
See charoff.
colspan | NN all IE all HTML 3.2 |
colspan="columnCount" | Optional | The colspan attribute specifies the number of
columns across which the current table cell should extend itself. For
each additional column included in the colspan
count, one less th or td
element is required for the table row. If you set the
align attribute to center or
right, the alignment is calculated on the full
width of the th element across the specified
number of columns. Unless the current cell is also specifies a
rowspan attribute, the next table row returns to
the original column count.
Example
<th colspan="2" align="right">
Value
Any positive integer, usually 2 or larger.
Default
1
Object Model Reference
[window.]document.getElementById(elementID).colSpan
datafld | NN n/a IE 4 HTML n/a |
datafld="columnName" | Optional | Used with IE data binding to associate a remote data source column
name with the content of a table header cell. A
datasrc (and optionally, a
datapagesize) attribute must also be set for the
enclosing table element. Works only with text file
data sources in IE 5/Mac.
Example
<table datasrc="DBSRC3" datapagesize="5">
<tr>
<th datafld="stockNum"></th>
<th datafld="qtyOnHand"></th>
</tr>
</table>
Value
Case-sensitive identifier.
Default
None.
headers="cellIDList" | Optional | Points to one or more th or td
elements that act as column or row headers for the current table
cell. The assigned value is a space-delimited list of
id attribute values that are assigned to the
relevant th elements. A nonvisual browser could
speak the cell's header before the content of the
cell to help listeners identify the nature of the cell content.
Although mainstream Version 6 browsers claim support for this
attribute, neither have yet connected support for it.
Example
<tr>
<th id="hdr1">Product Number</th>
<th id="hdr2">Description</th>
</tr>
<tr>
<th headers="hdr1">0392</th>
<th headers="hdr2">Round widget</th>
</tr>
Value
A space-delimited list of case-sensitive IDs assigned to cells that
act as headers to the current cell.
Default
None.
height, width | NN all IE all HTML 3.2 |
height="length"
width="length" The rectangular dimensions of a cell that may be different from the
default size as calculated by the browser. When the values for these
attributes are less than the minimum space required to render the
table cell content, the browser overrides the attribute settings to
make sure that all content appears, even if it means that text lines
word-wrap. You can also stretch the dimensions of a table beyond the
browser-calculated dimensions. Extra whitespace appears inside table
cells to make up the difference. If you specify just one of these
attributes, the browser performs all necessary calculations to
automatically adjust the dimension along the other axis.
Due to the regular nature of tables, if you set a custom height for
one cell in a row, the entire row is set to that height; similarly,
setting the width of a cell causes the width of all cells in the
column to be the same size.
Both the height and width
attributes are deprecated in HTML 4 in favor of
height and width style sheet
attributes (which are not available for table cells in Navigator 4).
Example
<th width="80%" height="30">
Value
Any length value in pixels or percentage of available space.
Default
Based on content size.
Object Model Reference
[window.]document.getElementById(elementID).height
[window.]document.getElementById(elementID).width
nowrap | NN all IE all HTML 3.2 |
The presence of the nowrap attribute instructs the
browser to render the cell as wide as is necessary to display a line
of nonbreaking text on one line. Abuse of this attribute can force
the user into a great deal of inconvenient horizontal scrolling of
the page to view all of the content. The nowrap
attribute is deprecated in HTML 4. The nowrap
attribute is deprecated in HTML 4 in favor of the
white-space:nowrap CSS attribute and value.
Example
<th nowrap>
Value
The presence of this attribute sets its value to
true.
Default
false
Object Model Reference
[window.]document.getElementById(elementID).noWrap
rowspan | NN all IE all HTML 3.2 |
rowspan="rowCount" | Optional | The number of rows through which the current table cell should extend
itself downward. For each additional row included in the
rowspan count, one less th or
td element is required for the next table row in
that cell's position along the row.
Example
<th rowspan="2">
Value
Any positive integer, usually 2 or larger.
Default
1
Object Model Reference
[window.]document.getElementById(elementID).rowSpan
scope="scopeConstant" | Optional | The range of cells (relative to the current cell) that behave as
though the current cell is the header for those cells. For tables
whose structure is quite regular, the scope
attribute is a simpler way of achieving what the
headers attribute does, without having to define
id attributes for the header cells. Although
maintstream Version 6 browsers claim support for this attribute,
neither have yet connected support for it.
Example
<tr>
<th scope="col">Product Number</th>
<th scope="col">Description</th>
</tr>
<tr>
<td>0392</td>
<td>Round widget</td>
</tr>
Value
One of four recognized scope constants:
- col
-
Current cell text becomes header text for every cell in the rest of
the column.
- colgroup
-
Current cell text becomes header text for every cell in the rest of
the colgroup element.
- row
-
Current cell text becomes header text for every cell in the rest of
the tr element.
- rowgroup
-
Current cell text becomes header text for every cell in the rest of
the tbody element.
Default
None.
valign | NN all IE all HTML 3.2 |
valign="alignmentConstant" | Optional | Determines the vertical alignment of content within the
td element. A value you set for an individual cell
overrides the same attribute setting for outer containers, such as
tr and tbody.
Example
<th valign="bottom">
Value
Four constant values: top |
middle | bottom |
baseline. With top and
bottom, the content is rendered flush (or very
close to it) to the top and bottom of the table cell. Set to
middle (the default), the content floats perfectly
centered vertically in the cell. When one cell's
contents might wrap to multiple lines at common window widths
(assuming a variable table width), it is advisable to set the
valign attribute to baseline.
This assures that the character baseline of the first (or only) line
of a cell's text aligns with the other cells in the
row—usually the most aesthetically pleasing arrangement.
Default
middle
Object Model Reference
[window.]document.getElementById(elementID).vAlign
See height.
<thead>...</thead> | HTML End Tag: Optional | A thead element is a special-purpose container of
one or more rows of table cells rendered at the top of the table. No
more than one thead element may be defined within
a single table element, and the
thead element should be located in the source code
immediately after the table
element's start tag. You are free to use any
combination of td and th
elements you like within the thead element. A
thead element is a row grouping, like the
tbody and tfoot elements.
Navigator 4 ignores the thead tag and therefore
renders the nested tr element(s) as regular
tr elements in source code order.
Example
<table cols="3">
<thead>
<tr>
<th>Time</th><th>Event</th><th>Location</th>
</tr>
</thead>
<tfoot>
<tr>
<th>Time</th><th>Event</th><th>Location</th>
</tr>
</tfoot>
<tbody>
<tr>
<td>7:30am-5:00pm</td><td>Registration Open</td><td>Main Lobby</td>
</tr>
<tr>
<td>9:00am-12:00pm</td><td>Keynote Speakers</td><td>Cypress Room</td>
</tr>
</tbody>
</table>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
align
|
bgcolor
|
ch
|
char
|
charoff
|
choff
|
valign
|
|
|
|
Element-Specific Event Handler Attributes
None.
align="alignConstant" | Optional | Establishes the horizontal alignment characteristics of content
within the row(s) covered by the thead element.
Example
<thead align="center">
Value
HTML 4 and various browsers implement different sets of attribute
values.
Value
|
IE/Windows
|
IE/Mac and NN 6
|
HTML 4
|
center
|
•
|
•
|
•
|
char
|
-
|
-
|
•
|
justify
|
-
|
•
|
•
|
left
|
•
|
•
|
•
|
right
|
•
|
•
|
•
|
The values center, left, and
right are self-explanatory. The value
justify spaces multiline content so that text is
justified down both left and right edges. For the value
char, the char attribute must
also be set to specify the character on which alignment revolves. In
the HTML 4 specification example, content that does not contain the
character appears to be right-aligned to the location of the
character in other rows of the same column.
It is important to bear in mind that the align
attribute applies to every cell of every row within the
thead, including any th element
you specify for the table. If you want a different alignment for the
row header, override the setting with a separate
align attribute or text-align style sheet
attribute for the individual th elements.
Default
left
Object Model Reference
[window.]document.getElementById(elementID).align
bgcolor | NN 6 IE 4 HTML n/a |
bgcolor="colorTripletOrName" | Optional | Establishes a fill color (behind the text and other content) for the
cells contained by the thead element.
Example
<thead bgcolor="tan">
Value
A hexadecimal triplet or plain-language color name. A setting of
empty is interpreted as "#000000" (black). See
Appendix A for acceptable plain-language color
names.
Default
Varies with browser, browser version, and operating system.
Object Model Reference
[window.]document.getElementById(elementID).bgColor
The char attribute defines the text character used
as an alignment point for text within a cell contained by the
thead element. This attribute is of value only for
the align attribute set to
"char". Microsoft documents a
ch attribute, which corresponds to the
standards-based char attribute. In any case, the
browser does not respond to either attribute. Netscape 7 has not yet
connected support for the char attribute.
Example
<thead align="char" char=".">
Value
Any single text character.
Default
None.
charoff | NN 6 IE n/a HTML 4 |
The charoff attribute lets you set a specific
offset point at which the character specified by the
char attribute is to appear within a cell
contained by the thead element. This attribute is
provided in case the browser default positioning does not meet with
the design goals of the table. Microsoft documents a
choff attribute, which corresponds to the
standards-based charoff attribute. In any case,
the browser does not respond to either attribute. Netscape 7 has not
yet connected support for the charoff attribute.
Example
<thead align="char" char="." charoff="80%">
Value
Any length value in pixels or percentage of cell space.
Default
None.
See charoff.
valign="alignmentConstant" | Optional | Determines the vertical alignment of content within cells of the
column(s) covered by the thead element. You can
override the vertical alignment for a particular cell anywhere in the
column.
Example
<thead valign="bottom">
Value
Four constant values: top |
middle | bottom |
baseline. With top and
bottom, the content is rendered flush (or very
close to it) to the top and bottom of the table cell. Set to
middle (the default), the content floats perfectly
centered vertically in the cell. When one cell's
contents might wrap to multiple lines at common window widths
(assuming a variable table width), it is advisable to set the
valign attribute to baseline.
This assures that the character baseline of the first (or only) line
of a cell's text aligns with the other cells in the
row—usually the most aesthetically pleasing arrangement.
Default
middle
Object Model Reference
[window.]document.getElementById(elementID).vAlign
<title> | NN all IE all HTML all |
<title>...</title> | HTML End Tag: Required | The title element identifies the overall content
of a document. The element content is not displayed as part of the
document, but browsers display the title in the browser
application's window titlebar. Only one
title element is permitted per document and it
must be located inside the head element. It is all
right to be somewhat verbose in assigning a document title because
not everyone will access the document in sequence through your web
site. Give the document some context as well.
Example
<title>Declaration of Independence</title>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<tr> | NN all IE all HTML all |
<tr>...</tr> | HTML End Tag: Optional | A tr element is a container for one row of cells.
Each cell within a row may be a th or
td element. Every row requires at least a start
tag to instruct the browser to begin rendering succeeding cell
elements on the next line of the table. Other special-purpose row
groupings available are the tfoot and
thead, as well as the more generic
tbody grouping element.
Example
<table cols="3">
<thead>
<tr>
<th>Time</th><th>Event</th><th>Location</th>
</tr>
</thead>
<tbody>
<tr>
<td>7:30am-5:00pm</td><td>Registration Open</td><td>Main Lobby</td>
</tr>
<tr>
<td>9:00am-12:00pm</td><td>Keynote Speakers</td><td>Cypress Room</td>
</tr>
</tbody>
</table>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
align
|
background
|
bgcolor
|
bordercolor
|
bordercolordark
|
bordercolorlight
|
ch
|
char
|
charoff
|
choff
|
height
|
valign
|
width
|
|
|
Element-Specific Event Handler Attributes
None.
align="alignConstant" | Optional | Establishes the horizontal alignment characteristics of content
within the row.
Example
<tr align="center">
Value
HTML 4 and various browsers implement different sets of attribute
values.
Value
|
IE/Windows
|
IE/Mac and NN 6
|
HTML 4
|
center
|
•
|
•
|
•
|
char
|
-
|
-
|
•
|
justify
|
-
|
•
|
•
|
left
|
•
|
•
|
•
|
right
|
•
|
•
|
•
|
The values center, left, and
right are self-explanatory. The value
justify spaces multiline content so that text is
justified down both left and right edges. For the value
char, the char attribute must
also be set to specify the character on which alignment revolves. In
the HTML 4 specification example, content that does not contain the
character appears to be right-aligned to the location of the
character in other rows of the same column.
It is important to bear in mind that the align
attribute applies to every cell within the tr
element, including any th element you specify for
the table. If you want a different alignment for the row header,
override the setting with a separate align
attribute or text-align style sheet attribute for
the tr or individual th
elements.
Default
center
Object Model Reference
[window.]document.getElementById(elementID).align
background | NN 4 IE n/a HTML n/a |
Specifies an image file that is used as a backdrop to the entire row
of cells. Unlike normal images that get loaded into browser content,
a background image loads in its original size (without scaling) and
tiles to fill the available cell space. Smaller images download
faster but are obviously repeated more often in the background.
Navigator 4, however, requires a minimum image size of 16 by 16
pixels. Animated GIFs are also allowable, but very distracting to the
reader. When selecting a background image, be sure it is very muted
in comparison to the main content so that the content stands out
clearly. Background images, if used at all, should be extremely
subtle.
Example
<tr background="watermark.jpg">
Value
Any valid URL to an image file, including complete and relative URLs.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).background
bgcolor="colorTripletOrName" | Optional | Establishes a fill color (behind the text and other content) for the
cells contained by the tr element.
Example
<tr bgcolor="lavender">
Value
A hexadecimal triplet or plain-language color name. A setting of
empty is interpreted as "#000000" (black). See
Appendix A for acceptable plain-language color
names.
Default
Varies with browser, browser version, and operating system.
Object Model Reference
[window.]document.getElementById(elementID).bgColor
bordercolor | NN n/a IE 3 HTML n/a |
bordercolor="colorTripletOrName" | Optional | The color used to render some of the pixels that create the illusion
of borders around cells and the entire table. Internet Explorer
applies the color to all four lines that make up the interior border
of a cell. Therefore, colors of adjacent cells do not collide.
Example
<tr bordercolor="green">
Value
A hexadecimal triplet or plain-language color name. A setting of
empty is interpreted as "#000000" (black). See
Appendix A for acceptable plain-language color
names.
Default
Varies with browser and operating system.
Object Model Reference
[window.]document.getElementById(elementID).borderColor
bordercolordark, bordercolorlight | NN n/a IE 3 HTML n/a |
bordercolordark="colorTripletOrName"
bordercolorlight="colorTripletOrName" The 3-D effect of table borders in Internet Explorer is created by
careful positioning of light and dark lines around the
page's background or default color (see Figure 8-4 in the table element
discussion). You can independently control the colors used for the
dark and light lines by assigning values to the
bordercolordark (left and top edges of the cell)
and bordercolorlight (right and bottom edges)
attributes.
Typically, you should assign complementary colors to the pair of
attributes. There is also no rule that says you must assign a dark
color to bordercolordark. The attributes merely
control a well-defined set of lines so you can predict which lines of
the border change with each attribute.
Example
<tr bordercolordark="darkred" bordercolorlight="salmon">
Value
A hexadecimal triplet or plain-language color name. A setting of
empty is interpreted as "#000000" (black). See
Appendix A for acceptable plain-language color
names.
Default
Varies with operating system.
Object Model Reference
[window.]document.getElementById(elementID).borderColorDark
[window.]document.getElementById(elementID).borderColorLight
The char attribute defines the text character used
as an alignment point for text within a cell contained by the
tr element. This attribute is of value only for
the align attribute set to
"char". Microsoft documents a
ch attribute, which corresponds to the
standards-based char attribute. In any case, the
browser does not respond to either attribute. Netscape 7 has not yet
connected support for the char attribute.
Example
<tr align="char" char=".">
Value
Any single text character.
Default
None.
charoff | NN n/a IE n/a HTML 4 |
The charoff attribute lets you set a specific
offset point at which the character specified by the
char attribute is to appear within a cell
contained by the tr element. This attribute is
provided in case the browser default positioning does not meet with
the design goals of the table. Microsoft documents a
choff attribute, which corresponds to the
standards-based charoff attribute. In any case,
the browser does not respond to either attribute. Netscape 7 has not
yet connected support for the charoff attribute.
Example
<tr align="char" char="." charoff="80%">
Value
Any length value in pixels or percentage of cell space.
Default
None.
See charoff.
valign="alignmentConstant" | Optional | Determines the vertical alignment of content within cells of the
column(s) covered by the tr element. You can
override the vertical alignment for a particular cell anywhere in the
row.
Example
<tr valign="bottom">
Value
Four constant values: top |
middle | bottom |
baseline. With top and
bottom, the content is rendered flush (or very
close to it) to the top and bottom of the table cell. Set to
middle (the default), the content floats perfectly
centered vertically in the cell. When one cell's
contents might wrap to multiple lines at common window widths
(assuming a variable table width), it is advisable to set the
valign attribute to baseline.
This assures that the character baseline of the first (or only) line
of a cell's text aligns with the other cells in the
row—usually the most aesthetically pleasing arrangement.
Default
middle
Object Model Reference
[window.]document.getElementById(elementID).vAlign
<tt> | NN all IE all HTML all |
<tt>...</tt> | HTML End Tag: Required | The tt element renders its content as monospaced
text (indicating a teletype output). The element is intended to be
strictly a formatting—as opposed to a contextual—element.
If you are looking for a contextual setting for computer program code
or input, see the code, kbd,
and samp elements. As with most font-related
elements, the use of style sheets is preferred.
Example
<p>The computer said, <tt>"That does not compute."</tt></p>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<u>...</u> | HTML End Tag: Required | The u element renders its content as underlined
text. This element is deprecated in HTML 4 in favor of the
text-decoration:underline style sheet attribute.
The element does not validate in strict HTML 4 or XHTML DTDs, and may
confuse users who regard any underlined text as a clickable link,
regardless of color.
Example
<p>You may already be a <u>winner</u>!</p>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<ul> | NN all IE all HTML all |
<ul>...</ul> | HTML End Tag: Required | The ul element is a container for an unordered
list of items. An "unordered list"
means that the items are rendered with a leading symbol (depending on
the type attribute setting or
list-style-type style sheet attribute setting)
that implies no specific order of items other than by virtue of
location within the list. Content for each list item is defined by a
nested li element. If you apply a style sheet rule
to a ul element, the style is inherited by the
nested li elements (except for occasional odd
behavior in Navigator 4 only).
Example
<ul>
<li>Africa</li>
<li>Antarctica</li>
<li>Asia</li>
<li>Australia</li>
<li>Europe</li>
<li>North America</li>
<li>South America</li>
</ul>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
Element-Specific Event Handler Attributes
None.
compact | NN 6 IE 4 HTML 3.2 |
A Boolean attribute originally designed to let browsers render the
list in a more compact style than normal (smaller line spacing
between items). Although listed as a supported attribute for HTML
compatibility, the compact attribute has no effect
on mainstream browsers. Use style sheets to control element sizes and
line spacing.
Example
<ul compact>...</ul>
Value
The presence of this attribute makes its value
true.
Default
false
type | NN all IE all HTML 3.2 |
The type attribute provides some flexibility in
how the leading symbol or sequence number is displayed in the
browser. You can specify whether the leading symbol should be a disc,
circle, or square. A disc is a filled circle (also known as a
bullet). The square type is rendered as an outline in early Macintosh
browsers, and as a filled square in Windows and modern browsers of
all OS types. The type attribute is deprecated in
HTML 4 in favor of the list-style-type style sheet
attribute.
Example
<ul type="disc">...</ul>
Value
Possible values are circle |
disc | square.
Default
disc
Object Model Reference
[window.]document.getElementById(elementID).type
<var> | NN all IE all HTML all |
<var>...</var> | HTML End Tag: Required | The var element is one of a large group of
elements that the HTML 4 recommendation calls phrase
elements. Such elements assign structural meaning to a
designated portion of the document. A var element
is one that is used predominantly to display one or more inline
characters representing a computer program variable name.
Browsers have free rein to determine how (or whether) to distinguish
var element content from the rest of the
body element. Both Navigator and Internet Explorer
elect to render var element content in an italic
font. Override the default with a style sheet as you see fit.
Example
<p>The value of <var>offsetWidth</var> becomes 20.</p>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<wbr> | NN all IE all HTML n/a |
<wbr> | HTML End Tag: Forbidden | If you use the nobr element to define content that
should have no word-wrapping or line breaks, you can use the
wbr element to advise the browser that it can
break up the content if the width of the browser window requires it.
The locations of these provisional breaks are marked in the source
code with the wbr element. In a sense, the
nobr and wbr elements give the
author control over word-wrapping of running content. Neither element
is included in the HTML specification, but they have long been a part
of both browsers' HTML vocabulary.
Example
<nobr>This is a long line of text that could run on and on, <wbr>forcing
the browser to display the horizontal scrollbar after awhile.</nobr>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
<xml> | NN n/a IE 5 HTML n/a |
<xml>...</xml> | End Tag: Required | IE 5 and later for Windows supports XML data islands, which are
self-contained, unrendered blocks of XML data within an HTML page.
The XML data may be delivered as part of the HTML document (embedded
between the start and end tags) or loaded from an external source.
Once the XML data is loaded, Microsoft's XML DOM
(which in many ways resembles the Core portion of the W3C DOM) allows
script access to the data for custom rendering. The W3C DOM
equivalent to this functionality is via the
document.implementation object. In IE, you may
also use ActiveX to create an XML document for loading external XML
data for script access. See Section 5.9.2.
Example
<xml id="xmlData">
<xmlresults>
<!-- xml data here -->
</xmlresults>
</xml>
Object Model Reference
[window.]document.getElementById(elementID)
Attributes
Event Handler Attributes
None.
Points to an external source of XML data to be loaded into the
element.
Example
<xml id="xmldata" src="http://www.magacorp.com/data/2003Forecast.xml></xml>
Value
Any valid URI whose return value contains XML data.
Default
None.
Object Model Reference
[window.]document.getElementById(elementID).src
<xmp> | NN all IE all HTML <4 |
<xmp>...</xmp> | HTML End Tag: Required | The xmp element displays its content in a
monospace font as a block element, as in computer code listings
rendered 80 columns wide. In most browsers, the font size is also
reduced from the default size. Browsers observe carriage returns and
other whitespace in element content. This element has long been
deprecated in HTML and has even been removed from the HTML 4
specification. You are encouraged to use the pre
element instead.
Example
<xmp>
<script language="JavaScript">
document.write("Hello, world.");
</script>
</xmp>
Object Model Reference
[window.]document.getElementById(elementID)
Element-Specific Attributes
None.
Element-Specific Event Handler Attributes
None.
| | | 8.2. Shared HTML Element Attributes | | 9. Document Object Model Reference |
Copyright © 2003 O'Reilly & Associates. All rights reserved.
|