Bore you can use JavaScript in a Web page, you need to know how to write a Web page. This appendix reviews the basic HTML you need to know to put together Web pages. It also reviews the structure of a good Web page.
Web pages are composed of HTML tags, content, and comments. The content-the plain text of the page-should be contained within HTML tags. Most browsers will display content that is not contained within HTML tags, but HTML standards don't require them to display uncontained content.
The content, not the tags, should contain comments, if for no better reason than that it makes the page more readable and easier to maintain. Comments begin with <!-- and end with -->. It's a good practice never to place a double dash (--) or a right angle bracket (>) within a comment. Some browsers may prematurely terminate the comment when they read these character sequences. It's important to remember this when writing JavaScript code, which you usually place inside comments to keep JavaScript-ignorant browsers from displaying the code on the screen.
HTML tags are special keywords enclosed within angle brackets (< and >). They may have attributes that refine the behavior of the tag; attributes are typically of the form name=value. When a tag has attributes, some of them are mandatory and the others are optional. Certain browsers may let you get away with omitting mandatory attributes, but you shouldn't expect all browsers to do so. The attribute values may be numeric or text, and may be enclosed within quotes. Some tools you can use to verify the syntax of your pages have trouble with attribute values; enclosing the values within quotes usually helps.
Tag and attribute names are case-insensitive. Attribute values are almost always case-sensitive. Because most content is lowercase (uppercase text is perceived as shouting), I prefer to write tag and attribute names in uppercase. It makes them stand out from the content.
Most tags have corresponding end tags. The end tag contains the same keyword as the first tag, or start tag, but with a leading slash (/) character. Like the start tag, it is enclosed within angle brackets. Unlike start tags, end tags do not have attributes.
Some tags contain text, and these tags have end tags. In certain specialized circumstances, the end tag is implied; for example, within a table row, a table cell that starts with a <TD> tag is implicitly ended by another <TD> tag. It is a good practice, however, always to use end tags. It makes your code easier to read and maintain.
An HTML element consists of either a tag that contains no text, such as an <IMG> tag, or a tag and its end tag and the text between them, such as
<B>Some bold text</B>
In the first case, the element is called an empty element. In the second case, the element is called a container element.
Certain rules dictate which HTML elements can exist within which other HTML elements. You can nest HTML elements, but their start and end tags cannot overlap. For example, you may wish to render text in a bold italic font. You can do so by enclosing the text within <B> and </B>, and within <I> and </I>. <B><I>text</I></B> will work. <I><B>text</B></I> will work. <B><I>text</B></I> will not work.
Some tags have attributes in common with each other. These common attributes take common values, and these values may not be very obvious as to what they do. Uniform Resource Locators, colors, the ALIGN attribute, and the CLEAR attribute are not well understood.
Uniform Resource Locators, or URLs, specify the location of documents on the Internet, and the protocol that is used to retrieve them. The general format of a URL is
protocol hostname port pathname search hash
These are defined as follows:
| protocol | The beginning of a URL, up to the first colon. Common protocols include javascript: (JavaScript code), about: (navigator information), http: (World Wide Web), file: (local file), ftp: (FTP), mailto: (mail), news: (Usenet news), and gopher: (Gopher). The protocol may be separated from the rest of the URL by two slashes (http:, ftp:, news:), three slashes (file:), or no slashes (javascript:, about:, mailto:, gopher:). |
| hostname | The host and domain name, or IP address, of a network host. |
| port | The number of the communications port used by the network host for communication. Many protocols define a "well-known" port number (21 for FTP, 70 for Gopher, 80 for the World Wide Web, 119 for Usenet news, to name a few) for the protocol, and because most hosts use the well-known port numbers, the port component is rarely used. |
| pathname | The path of the file, including the file name, on the network host. |
| search | Query information, beginning with a question mark. |
| hash | An anchor name, beginning with a hash mark (#) |
An absolute URL has a protocol, host name, and path name, and may include a port, search, and hash field.
A relative URL has no protocol or host name, and the path name is not usually a full path name.
Tags that take color attributes may specify the color values in two different ways: by name or by hex triplet.
There are 140 defined color names, such as red, black, and turquoise. For a complete list of these defined colors, check the code listings for Chapter 6
Hex triplets consist of a pound sign followed by the hexadecimal values of the red component, the green component, and the blue component. Each component may have a value from 00 to FF, and must have two digits.
Some elements can float freely within a stream of text, and have ALIGN attributes that permit you to dictate where the element will appear on the screen. The most common values for the ALIGN attribute are left, right, top, texttop, middle, absmiddle, baseline, bottom, and absbottom.
Left and right alignment (ALIGN="left" and ALIGN="right") place a free-floating element below the current line of text, on either the left margin or the right margin. Text flows around the element.
Top and texttop alignment (ALIGN="top" and ALIGN="texttop") place a free-floating element on the screen so that the top of the element is lined up with the top of the line up to that point. In other words, alignment is with respect to text and elements to the left of the current element. The difference between top and texttop alignment is that top alignment takes text and elements into account, and texttop alignment only considers text.
Middle and absmiddle alignment (ALIGN="middle" and ALIGN="absmiddle") place a free-floating element on the screen so that the middle of the element is lined up with either the baseline of the text (ALIGN="middle") or with the middle of the text and elements to the left (ALIGN="absmiddle"). When there is nothing but text to the left, there is almost no difference between the two.
Baseline, bottom, and absbottom alignment (ALIGN="baseline", ALIGN="bottom", and ALIGN="absbottom") place a free-floating element on the screen so that the bottom of the element is lined up either with the baseline of the text (ALIGN="baseline" and ALIGN="bottom"-they are synonymous) or with the bottom of the lowest text or element to the left of the free-floating element (ALIGN="absbottom").
CLEAR is a common attribute used by elements. This attribute specifies that the browser should go farther down the screen until the specified margin is clear before displaying the element's text. Typical values are left, right, and all (both left and right margins must be clear).
In Figures C.1 through C.4, a BR (line break) element, which can take a CLEAR attribute, is inserted into the text following the word "break." In Figure C.1, with CLEAR="left", the text stops until the image on the left is cleared, and then resumes. In Figure C.2, with CLEAR="right", the text stops until the image on the right is cleared, and then resumes. In Figure C.3, with CLEAR="all", the text stops until both images are cleared, and then resumes. Finally, in Figure C.4, there is no CLEAR attribute and text resumes on the next line, between the two images.
Figure C.1 : <BR CLEAR="left">.
Figure C.2 : <BR CLEAR="right">.
This section includes short descriptions of the HTML elements currently supported by Netscape. These elements do not pertain solely to JavaScript. Each element description mentions commonly used attributes of the element, explains the function of the element, includes special notes about the element, and tells what elements may be contained within that element.
Figure C.3 : <BR CLEAR="all">.
Figure C.4 : <BR> with no CLEAR attribute.
The A element marks the beginning of a hypertext link if it uses
the HREF attribute or the destination of a hypertext link if it
uses the NAME attribute. In JavaScript, it's a link object if
it uses the HREF attribute and an anchor object if it contains
the NAME attribute. There are five attributes, but an A element
must have an HREF or NAME attribute. Both can be used in the same
element-an A element may be both a link object and an anchor object.
| HREF=string | The value specifies the target of a hypertext link. |
| NAME=string | The value creates a destination for a hypertext link. |
| ONCLICK=string | The value specifies a JavaScript expression to be executed when the user clicks on the element. This only applies to A elements that have an HREF attribute defined. |
| ONMOUSEOVER= string | The value specifies a JavaScript expression to be executed when the user moves the mouse pointer over the element. This only applies to A elements that have an HREF attribute defined. |
| TARGET=string | The value specifies a window or frame into which the link will be loaded. This only applies to A elements that have an HREF attribute defined. |
The A element is a container element that can contain content text and B, BASEFONT, BIG, BLINK, BR, CITE, CODE, EM, FONT, H1, H2, H3, H4, H5, H6, I, IMG, KBD, NOBR, SAMP, SMALL, STRIKE, SUB, SUP, TT, VAR, and WBR elements. It may not contain another A element. Its contents are usually highlighted by the browser when the HREF attribute is used.
The ADDRESS element indicates that its contents constitute an address. Typical usage would include electronic signatures and lists of authors. This element has no attributes, and it is a container element that may contain content text and A, B, BASEFONT, BIG, BLINK, BR, CITE, CODE, EM, FONT, I, IMG, KBD, NOBR, P, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TT, VAR, and WBR elements.
The APPLET element loads a Java applet and executes it. It has
eight attributes:
| ALIGN=string | The value specifies the applet's alignment on the page. Permitted values include left, right, top, texttop, middle, absmiddle, baseline, bottom, and absbottom. |
| CODE=string | The value specifies the relative URL of the applet. This attribute is mandatory. |
| CODEBASE=string | The value specifies a base URL for the CODE attribute's relative URL. In the absence of this attribute, the document URL becomes the base URL. |
| HEIGHT=number | The value specifies the height, in pixels, of the applet. This attribute is mandatory. |
| HSPACE=number | The value specifies the horizontal distance, in pixels, between the applet and surrounding text. |
| NAME=string | The value creates a destination for a hypertext link. |
| VSPACE=number | The value specifies the vertical distance, in pixels, between the applet and surrounding text. |
| WIDTH=number | The value specifies the width, in pixels, of the applet. This attribute is mandatory. |
The APPLET element is a container element that may contain content text and A, B, BASEFONT, BIG, BLINK, BR, CITE, CODE, EM, FONT, I, IMG, KBD, NOBR, PARAM, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, VAR, and WBR elements.
The AREA element defines a region within a MAP element that the user may select. If the HREF attribute is used, the area acts like the beginning of a hypertext link. If the NOHREF attribute is used, the area acts like a "dead zone"; if the user clicks in such an area, nothing happens. There can be multiple AREA elements within a MAP element. In case of overlap, the first AREA element that contains the coordinates the user selected will be the active element. The coordinates start in the image's upper-left corner.
There are four attributes:
| COORDS=string | The value specifies the coordinates that define the area.
If the area is a rectangle, there are four coordinates: left, top, right, and bottom. If the area is a circle, there are three coordinates: the center of the circle (horizontal coordinate and then vertical coordinate) followed by the radius. If the area is a polygon, there are an arbitrary number of coordinate pairs. In this case, each pair describes a vertex of the polygon. The vertex's horizontal coordinate is first, followed by the vertical coordinate. The last pair does not need to match the first pair; in that case, the browser will assume a line segment between the first vertex and the last vertex. |
| HREF=string | The value identifies a hypertext link that will be the target if a point within this area's coordinates is selected. |
| NOHREF | This attribute means that this area describes a dead zone; nothing will happen if you select a point within this area's coordinates. |
| SHAPE=string | The value specifies the shape of the area. Valid values include circle, rect (rectangle), and poly (polygon). The default shape is a rectangle. |
The AREA element is an empty element.
The B element specifies that the browser should render the contents in a bold font.
There are no attributes. The B element is a container element that may contain content text and A, B, BASEFONT, BIG, BLINK, BR, CITE, CODE, EM, FONT, I, IMG, KBD, NOBR, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TT, VAR, and WBR elements.
The BASE element overrides the Web page's URL as the base for relative URLs. It has one mandatory attribute, HREF=string, where the value specifies the base for relative URLs.
The BASE element is empty.
The BASEFONT element overrides the value of the base font size (which by default is 3). The browser adds relative FONT element values to the base font size. The BASEFONT element has one mandatory attribute, SIZE=number, where the number value is the base font size.
The BASEFONT element is a container element that may contain content text and A, ADDRESS, APPLET, B, BASEFONT, BIG, BLINK, BLOCKQUOTE, BR, CENTER, CITE, CODE, DIR, DIV, DL, EM, FONT, FORM, H1, H2, H3, H4, H5, H6, HR, I, IMG, KBD, MAP, MENU, NOBR, OL, P, PRE, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TABLE, TT, UL, VAR, and WBR elements.
The BIG element specifies that the browser should render the contents in a larger than normal font.
There are no attributes. The BIG element is a container element that may contain content text and A, B, BASEFONT, BIG, BLINK, BR, CITE, CODE, EM, FONT, I, IMG, KBD, NOBR, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TT, VAR, and WBR elements.
The BLINK element requests that contained elements be rendered in a blinking font. The blinking effect is as alarming as a shout of "Fire!" Just as most of us don't have a reason to pull the fire alarm every day, there is hardly ever a good reason to include blinking text in an ordinary document. Use of BLINK is considered even more vulgar than writing text in all uppercase.
There are no attributes. The BLINK element is a container element that may contain content text and A, B, BASEFONT, BIG, BLINK, BR, CITE, CODE, EM, FONT, I, IMG, KBD, NOBR, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TT, VAR, and WBR elements.
The BLOCKQUOTE element indicates that its contents constitute a quotation.
The BLOCKQUOTE element has no attributes. It is a container element that may contain content text and A, ADDRESS, APPLET, B, BASEFONT, BIG, BLINK, BLOCKQUOTE, BR, CENTER, CITE, CODE, DIR, DIV, DL, EM, FONT, FORM, H1, H2, H3, H4, H5, H6, HR, I, IMG, KBD, MAP, MENU, NOBR, OL, P, PRE, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TABLE, TT, UL, VAR, and WBR elements.
The BODY element contains the visible contents of the document.
The BODY element has eight optional attributes:
| ALINK=color | The value specifies the color for the active link (the link currently selected by the user). |
| BACKGROUND=string | The value specifies the URL of an image file that will be tiled to form the background. |
| BGCOLOR=color | The value specifies the color for the background. |
| LINK=color | The value specifies the color of unvisited links. |
| ONLOAD=string | The value specifies a JavaScript expression to be executed when the Web page finishes loading. |
| ONUNLOAD=string | The value specifies a JavaScript expression to be executed when the user leaves the Web page. |
| TEXT=color | The value specifies the color of ordinary text. |
| VLINK=color | The value specifies the color of visited links. |
The BODY element is a container element that may contain content text and A, ADDRESS, APPLET, B, BASEFONT, BIG, BLINK, BLOCKQUOTE, BR, CENTER, CITE, CODE, DIR, DIV, DL, EM, FONT, FORM, H1, H2, H3, H4, H5, H6, HR, I, IMG, KBD, MAP, MENU, NOBR, OL, P, PRE, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TABLE, TT, UL, VAR, and WBR elements.
The BR element forces a line break. It has one optional attribute, CLEAR=string, where the value indicates how far down the browser should space until the indicated margin is clear of text and images. Valid values include left, right, and all.
The BR element is an empty element.
The CAPTION element defines a table caption. It has two attributes:
| ALIGN=string | The value indicates how the caption should be horizontally aligned with its table. Valid values include top, bottom, left, and right. |
| ID=string | The value defines a hypertext link target. |
The CAPTION element is a container element that may contain content text and A, B, BASEFONT, BIG, BLINK, BR, CITE, CODE, EM, FONT, I, IMG, KBD, NOBR, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TT, VAR, and WBR elements.
The CENTER element indicates that the browser should horizontally center the contained text. It has no attributes. The CENTER element is a container element that may contain content text and A, ADDRESS, APPLET, B, BASEFONT, BIG, BLINK, BLOCKQUOTE, BR, CENTER, CITE, CODE, DIR, DIV, DL, EM, FONT, FORM, H1, H2, H3, H4, H5, H6, HR, I, IMG, KBD, MAP, MENU, NOBR, OL, P, PRE, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TABLE, TT, UL, VAR, and WBR elements.
The CITE element indicates that the contained text is a citation.
There are no attributes. The CITE element is a container element that may contain content text and A, B, BASEFONT, BIG, BLINK, BR, CITE, CODE, EM, FONT, I, IMG, KBD, NOBR, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TT, VAR, and WBR elements.
The CODE element indicates that the contained text is computer code and should be rendered in a suitable font. This element is recommended for short, single-line text; the PRE element is the element of choice for longer text, especially multiline text.
There are no attributes. The CODE element is a container element that may contain content text and A, B, BASEFONT, BIG, BLINK, BR, CITE, CODE, EM, FONT, I, IMG, KBD, NOBR, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TT, VAR, and WBR elements.
The DD element contains the definition portion of a definition list item. It has no attributes, and is a container element that may contain content text and A, APPLET, B, BASEFONT, BIG, BLINK, BLOCKQUOTE, BR, CENTER, CITE, CODE, DIR, DL, EM, FONT, FORM, I, IMG, KBD, MENU, NOBR, OL, P, PRE, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TABLE, TT, UL, VAR, and WBR elements.
The DIR element creates a list of short text items, such as file names. It has no attributes, and is a container element that may contain LI elements and their contents. A DIR element cannot contain APPLET, BLOCKQUOTE, CENTER, DIR, DL, FORM, MENU, OL, P, PRE, TABLE, or UL elements.
The DIV element breaks a document into major subdivisions. It
has five attributes:
| ALIGN=string | The value specifies the horizontal alignment of the division. Valid values include left, center, and right. |
| CLEAR=string | The value indicates how far down the browser should space until the indicated margin is clear of text and images. Valid values include left, right, and all. |
| ID=string | The value defines a hypertext link target. |
| NEEDS=number | The value specifies the minimal width required for this element. |
| NOWRAP | This attribute disables line wrap. |
The DIV element is a container element that may contain content text and A, ADDRESS, APPLET, B, BASEFONT, BIG, BLINK, BLOCKQUOTE, BR, CENTER, CITE, CODE, DIR, DIV, DL, EM, FONT, FORM, H1, H2, H3, H4, H5, H6, HR, I, IMG, KBD, MAP, MENU, NOBR, OL, P, PRE, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TABLE, TT, UL, VAR, and WBR elements.
The DL element contains a list of definitions. It has one attribute, COMPACT, which suggests that the list be rendered in a more compact form.
The DL element is a container element that may contain DD and DT elements.
The DT element contains a term in a list of definitions. It has no attributes, and is a container element that may contain content text and A, B, BASEFONT, BIG, BLINK, BR, CITE, CODE, EM, FONT, I, IMG, KBD, NOBR, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TT, VAR, and WBR elements.
The EM element indicates that the browser should emphasize the contents. Browsers typically render the contents in an italic font.
There are no attributes. The EM element is a container element that may contain content text and A, B, BASEFONT, BIG, BLINK, BR, CITE, CODE, EM, FONT, I, IMG, KBD, NOBR, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TT, VAR, and WBR elements.
The FONT element defines the font size for contained text. The
size may be absolute or relative; the browser adds the base font
value to relative font sizes. This element has two attributes:
| COLOR=color | The value specifies the color for normal text within the FONT element. |
| SIZE=string | The value may be a number (absolute size) or a number preceded by a + or - character (relative size). |
The FONT element is a container element that may contain content text and A, B, BASEFONT, BIG, BLINK, BR, CITE, CODE, EM, FONT, I, IMG, KBD, NOBR, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TT, VAR, and WBR elements.
The FORM element defines a block of input fields that the user may fill in. The browser usually sends the user's data to a CGI application on the server. If the GET method is used, the CGI application can access an environment variable with the name QUERY_STRING. If the POST method is used, the CGI application can read the data from the standard input stream (stdin); the environment variable CONTENT_LENGTH contains the length of the data. Data is sent as name=value pairs separated by ampersands (&). The name=value pairs are URL-encoded-spaces are converted to pluses (+) and some characters are converted to a percent (%) character followed by the character's two-digit hexadecimal value.
The FORM element has six attributes:
| ACTION=string | The value specifies either a CGI URL or a mailto: URL. This attribute is mandatory. |
| ENCTYPE=string | The value specifies the MIME encoding for the data when it is sent to the server. The values can be application/x-www-form-urlencoded (the default value) or multipart/form-data. |
| METHOD=string | The value specifies how the data should be sent. The valid values are GET (the default) and POST. |
| NAME=string | The value specifies the name of the corresponding JavaScript form object |
| ONSUBMIT=string | The value specifies a JavaScript expression to be executed when the user clicks on the SUBMIT button. |
| TARGET=string | The value specifies the name of a window or frame object into which the form responses will be written. |
A FORM element is a container element that may contain content text and A, ADDRESS, APPLET, B, BASEFONT, BIG, BLINK, BLOCKQUOTE, BR, CENTER, CITE, CODE, DIR, DIV, DL, EM, FONT, H1, H2, H3, H4, H5, H6, HR, I, IMG, INPUT, KBD, MAP, MENU, NOBR, OL, P, PRE, SAMP, SELECT, SMALL, STRIKE, STRONG, SUB, SUP, TABLE, TEXTAREA, TT, UL, VAR, and WBR elements. A FORM element may not contain another FORM element. A FORM element must contain at least one INPUT, SELECT, or TEXTAREA element.
The FRAME element defines a frame, which is a subsection of the
browser screen. It has six attributes:
| MARGINHEIGHT= number | The value specifies the size of the top and bottom margins of the frame. The value cannot be zero; you cannot use this attribute to erase the line between frames, and you cannot make the value so large as to squeeze another frame out of existence. If you do not use this attribute, the browser sets the upper and lower margins as it sees fit. |
| MARGINWIDTH= number | The value specifies the size of the left and right margins of the frame. The value cannot be zero; you cannot use this attribute to erase the line between frames, and you cannot make the value so large as to squeeze another frame out of existence. If you do not use this attribute, the browser sets the left and right margins as it sees fit. |
| NAME=string | The value is assigned to its frame so that the frame can be targeted by other links. This is the corresponding frame object's name attribute. By default, frames are unnamed. |
| NORESIZE | This attribute prevents the user from being able to resize this frame. Frames that share an edge with this frame cannot be resized if doing so would force this frame to be resized. |
| SCROLLING=string | The value indicates how scroll bars should be used with the frame. Valid values are yes, no, and auto. The browser will always display the scroll bar if the value is yes. The browser will never display the scrollbar if the value is no. The browser will display the scrollbar as it sees fit if the value is auto. The default value is auto. |
| SRC=string | The value specifies the URL for the document to be loaded into the frame. The frame will be empty if you do not use this attribute. The frame will also be empty if the specified URL happens to be the URL of an ancestor to this frame. This helps prevent infinite recursion. |
The FRAME element is an empty element.
The FRAMESET element defines a set of frames and how the containing window or frame will be divided to hold them.
A FRAMESET element has four attributes:
| COLS=string | The value describes how the columns of frames will be allocated window space. |
| ONLOAD=string | The value specifies a JavaScript expression to be executed when the Web page has been loaded. |
| ONUNLOAD=string | The value specifies a JavaScript expression to be executed when the user leaves the Web page. |
| ROWS=string | The value describes how the rows of frames will be allocated window space. |
A FRAMESET element must have either a COLS or a ROWS attribute, but not both. The COLS and ROW attribute values consist of frame widths or heights separated by commas. There should be no spaces in the value, and there should be one frame width or height for each FRAME or FRAMESET contained in the FRAMESET element. Frame widths and heights may be numbers, percentages (number followed by a percent sign), or relative values (an asterisk preceded by an optional number). Values that are numbers specify the height or width of the corresponding FRAME or FRAMESET element in pixels. Percentage values specify the percentage of the available space that should be allocated to the corresponding FRAME or FRAMESET element. Relative valued elements are allocated after all number and percentage valued elements have been allocated. If there are no relative values and the percentage values do not add up to 100 percent, the browser will adjust the percentage values to add up to 100 percent.
A FRAMESET element is a container element that may contain FRAME, NOFRAME, and FRAMESET elements.
The H1, H2, H3, H4, H5, and H6 elements create headings. The most
prominent is H1 and the least prominent is H6. These elements
have three attributes:
| ALIGN=string | The value specifies the horizontal alignment of the heading. Valid values include left, center, right, and justify. |
| CLEAR=string | The value indicates how far down the browser should space until the indicated margin is clear of text and images. Valid values include left, right, and all. |
| ID=string | The value defines a hypertext link target. |
Heading elements are container elements that may contain content text and A, B, BASEFONT, BIG, BLINK, BR, CITE, CODE, EM, FONT, I, IMG, KBD, NOBR, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TT, VAR, and WBR elements.
The HEAD element contains information about the document. It has no attributes and is a container element that may contain BASE, ISINDEX, LINK, META, NEXTID, SCRIPT, and TITLE elements. A TITLE element is considered mandatory by HTML specifications, but if the document is intended solely as a frame within a larger document, the TITLE element will be ignored and is not necessary. The NEXTID element is used only by automated hypertext editors, and its use is not recommended.
The HR element draws a horizontal line across the page. There
are four attributes:
| ALIGN=string | The value specifies the horizontal alignment of the rule. Valid values include left, center, and right. |
| NOSHADE | This attribute indicates that the rule should not include shading. |
| SIZE=number | The value specifies the thickness of the line. |
| WIDTH=string | The value specifies the width of the line, possibly as a percentage of the window width. |
The HR element is an empty element.
The HTML element contains the entire document. It has no attributes, and it should contain a HEAD element followed by a BODY or FRAMESET element. In your JavaScript code, either or both elements may be superfluous.
The I element specifies that the browser should render the contents in an italic font.
There are no attributes. The I element is a container element that may contain content text and A, B, BASEFONT, BIG, BLINK, BR, CITE, CODE, EM, FONT, I, IMG, KBD, NOBR, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TT, VAR, and WBR elements.
The IMG element embeds an inline image in the document. The image may be used as an image map-an image that contains clickable areas that act as a links to other URLs.
An image has height and width. You can specify these two quantities in the IMG element. Although they are not mandatory, there are two good reasons to treat them as mandatory:
The IMG element has 11 attributes:
| ALIGN=string | The value specifies the horizontal alignment of the image. Valid values include left, right, center, top, texttop, middle, absmiddle, baseline, bottom, and absbottom. |
| ALT=string | The value provides text that a nongraphics browser may display instead of the image. |
| BORDER=number | The value specifies the thickness of the border around the image. |
| HEIGHT=number | The value specifies the height, in pixels, of the image. For pages using JavaScript, this attribute is mandatory. |
| HSPACE=number | The value specifies how far, in pixels, to separate the image from text on either side. |
| ISMAP | This attribute indicates that the image is a server-side image map. To be useful, an IMG element with an ISMAP attribute has to be enclosed within an A element that has an HREF attribute (a link object). When the user clicks on a point in the image, the coordinates of the point are sent to the URL specified in the enclosing A element's HREF attribute. The URL is typically the location of a CGI application on the server. |
| LOWSRC=string | The value specifies the URL of a lower resolution version of the image that can be quickly loaded. The idea is that, as time permits, the browser will replace the image with the real image. |
| SRC=string | The value specifies the URL of the image file. This attribute is mandatory. |
| USEMAP=string | The value specifies the relative URL of a MAP element; this image is a client-side image map. |
| VSPACE=number | The number value specifies how far, in pixels, to separate the image from text above and below it. |
| WIDTH=number | The number value specifies the width, in pixels, of the image. For pages using JavaScript, this attribute is mandatory. |
The IMG element is an empty element.
The INPUT element creates an input field. There are nine types of input fields.
The INPUT element has 13 attributes:
| ALIGN=string | The value specifies the alignment of the field on the page. Valid values include top, middle, and bottom. |
| CHECKED | This attribute is used for checkbox and radio button input fields and specifies that the field be in the selected state. |
| MAXLENGTH= number | The value specifies the maximum length for text in a text or password input field. |
| NAME=string | The value specifies the name of the field. This attribute is mandatory. All radio fields that define a set of radio buttons must have the same name value. |
| ONBLUR=string | The value specifies a JavaScript expression to be executed when the user transfers focus from this input field to another. This applies to password and text fields. |
| ONCHANGE= string | The value specifies a JavaScript expression to be executed when the user changes the data in the field and presses Enter or transfers focus from this input field to another. This applies to text fields. |
| ONCLICK= string | The value specifies a JavaScript expression to be executed when the user clicks on the INPUT element. This applies to button, checkbox, radio, reset, and submit fields. |
| ONFOCUS= string | The value specifies a JavaScript expression to be executed when the user clicks on the INPUT element. This applies to password and text fields. |
| ONSELECT= string | The value specifies a JavaScript expression to be executed when the user highlights some or all of the INPUT field's contents. This applies to password and text fields. |
| SIZE=number | The value specifies the size of the field. For text and password fields, this is the number of characters that can be entered in the box without scrolling. |
| SRC=string | The value specifies the URL of the image for an image field. |
| TYPE=string | The value specifies the kind of field. Valid values are button, checkbox, hidden, image, password, radio, reset, submit, and text. This attribute is mandatory. |
| VALUE=string | The value used depends on the field type. It specifies the initial value displayed in a text field. It specifies the button label for a button, reset, or submit field. It specifies the value returned to the server for a checkbox or radio field. It specifies a default (undisplayable) value for a password field. It specifies the initial (unseen) value for a hidden field. |
The INPUT element is an empty element.
The ISINDEX element indicates that the document is a searchable
index. It has one attribute:
| PROMPT=string | The string value specifies a string to be used before the text input field of the index. The default value is "This is a searchable index. Enter search keywords:". |
The ISINDEX element is an empty element.
The KBD element specifies that the browser should render contained text as keyboard input.
There are no attributes. The KBD element is a container element that may contain content text and A, B, BASEFONT, BIG, BLINK, BR, CITE, CODE, EM, FONT, I, IMG, KBD, NOBR, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TT, VAR, and WBR elements.
The LI element creates an item in a list. It has two attributes:
| TYPE=string | The value specifies the type of bullet or numbering to be used in front of the contained text. Valid values include disc, circle, square, a, A, i, I, and 1. A and a refer to lowercase and uppercase letters; I and i refer to lowercase and uppercase roman numerals; 1 refers to ordinary numerals. |
| VALUE=number | The value indicates where to start numbering for letters, Roman numerals, and numerals. The number is incremented with each LI element that follows. A value of 6, as an example, would be represented as F or f (letters), VI or vi (roman numerals), or 6 (numerals). |
The LI element is a container element that may contain content text and A, APPLET, B, BASEFONT, BIG, BLINK, BLOCKQUOTE, BR, CENTER, CITE, CODE, DIR, DL, EM, FONT, FORM, I, IMG, KBD, MENU, NOBR, OL, P, PRE, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TABLE, TT, UL, VAR, and WBR elements. It may not contain another LI element.
The LINK element describes an association with another document.
The LINK element is rarely used; its chief value lies in statically
documenting an association with another document. It has two attributes:
| HREF=string | The value specifies the URL of the other document. This attribute is mandatory. |
| TITLE=string | The value specifies the title of the other document. |
The LINK element is an empty element.
The MAP element describes a set of selectable areas within a client-side image map. It has one mandatory attribute, NAME=string, where the value gives a name that can be used by the IMG element in its USEMAP attribute.
The MAP element is a container element that contains only AREA elements.
The MENU element contains a list of items. It has no attributes, and is a container element that may contain APPLET, BLOCKQUOTE, CENTER, DIR, DL, FORM, LI, OL, P, PRE, TABLE, and UL elements.
The META element adds information to the document's HEAD element
that does not fit anywhere else. It has three attributes:
| CONTENT=string | The value specifies the content associated with this element. This attribute is mandatory. |
| HTTP-EQUIV= string | The value specifies a field to be sent by the server in an HTTP response header. |
| NAME=string | The value specifies a string that the client browser may be expected to understand. |
You should use either the HTTP-EQUIV or the NAME attribute, but not both.
The META element is an empty element.
The NOBR element prevents the browser from inserting line breaks. It has no attributes. The NOBR element is a container element that may contain content text and A, B, BASEFONT, BIG, BLINK, BR, CITE, CODE, EM, FONT, I, IMG, KBD, NOBR, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TT, VAR, and WBR elements.
The NOFRAME element allows you to provide content for browsers that do not understand FRAMESET and FRAME elements. It has no attributes, and is a container element that may contain content text and A, ADDRESS, APPLET, B, BASEFONT, BIG, BLINK, BODY, BLOCKQUOTE, BR, CENTER, CITE, CODE, DIR, DIV, DL, EM, FONT, FORM, H1, H2, H3, H4, H5, H6, HR, I, IMG, KBD, MAP, MENU, NOBR, OL, P, PRE, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TABLE, TT, UL, VAR, and WBR elements.
The OL element contains a list that is strongly ordered in some
fashion, such as an alphabetized list. It has three attributes:
| COMPACT | This attribute advises the browser to display the list in a more compact fashion than it normally would. |
| START=number | The value indicates where the first LI element should start numbering. The number is incremented with each subsequent LI element. A value of 6, as an example, would be represented as F or f (letters), VI or vi (Roman numerals), or 6 (numerals). |
| TYPE=string | The value specifies how the list items should be numbered. Valid values include a (lowercase letters), A (uppercase letters), i (lowercase Roman numerals), I (uppercase Roman numerals), and 1 (numerals). |
The OL element is a container element that may only contain LI elements.
The OPTION element specifies an option within a SELECT element.
It has two attributes:
| SELECTED | This attribute marks the option as selected. |
| VALUE=string | The value is the value of the element when the form is submitted. If this attribute is not used, the value will be the text contained in the element. |
The OPTION element is a container element that may only contain content text.
The P element contains a paragraph. It forces a break before and
after the contained text. In response to strings of empty P elements,
some browsers will increase the thickness of the break; others
will not. The P element has five attributes:
| ALIGN=string | The value specifies how the paragraph should be aligned. Valid values include left, center, and right. |
| CLEAR=string | The value indicates how far down the browser should space until the indicated margin is clear of text and images. Valid values include left, right, and all. |
| ID=string | The value defines a hypertext link target. |
| NEEDS=number | The value specifies the minimal width needed for the paragraph. |
| NOWRAP | This attribute specifies that line wrap is disabled. |
The P element is a container element and may contain content text and A, B, BASEFONT, BIG, BLINK, BR, CITE, CODE, EM, FONT, I, IMG, KBD, NOBR, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TT, VAR, and WBR elements.
The PARAM element specifies a parameter for the containing APPLET
element. It has two attributes:
| NAME=string | The value specifies the name of a parameter. This attribute is mandatory. |
| VALUE=string | The string value specifies the value of the parameter. |
The PARAM element is an empty container.
The PRE element specifies that the browser is to render text as is, with its embedded line breaks and spaces intact. It has one attribute, WIDTH=number, where the value specifies the width of the text in characters. The browser should break the line after reaching the specified number of characters.
The PRE element is a container element and may contain content text and the elements A, BR, and HR.
The SAMP element indicates that the browser should render contained text as a sequence of literal characters.
There are no attributes. The SAMP element is a container element that may contain content text and A, B, BASEFONT, BIG, BLINK, BR, CITE, CODE, EM, FONT, I, IMG, KBD, NOBR, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TT, VAR, and WBR elements.
The SCRIPT element contains JavaScript code. It has one attribute, LANGUAGE= string, which is used to specify the language. It has two values, LiveScript and JavaScript. There is very little difference between the two. You should always use the JavaScript value.
The SCRIPT element is a container element that contains content text as JavaScript code.
The SELECT element specifies a set of options from which the user
may choose. It has six attributes:
| MULTIPLE | This attribute indicates that more than one enclosed OPTION element may be selected at the same time. |
| NAME=string | The value specifies the name of the variable. This attribute is mandatory. |
| ONBLUR=string | The value specifies a JavaScript expression to be executed when focus is moved from this element to another. |
| ONCHANGE= string | The value specifies a JavaScript expression to be executed when the user changes the selected value and focus is moved from this element to another. |
| ONFOCUS= string | The value specifies a JavaScript expression to be executed when the user gives this element focus. |
| SIZE=number | The value specifies the number of displayed options. |
The SELECT element is a container that may only contain OPTION elements.
The SMALL element specifies that the browser should render the contents in a smaller than normal font.
There are no attributes. The SMALL element is a container element that may contain content text and A, B, BASEFONT, BIG, BLINK, BR, CITE, CODE, EM, FONT, I, IMG, KBD, NOBR, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TT, VAR, and WBR elements.
The STRIKE element specifies that the browser should render the contents in a strikethrough font.
There are no attributes. The STRIKE element is a container element that may contain content text and A, B, BASEFONT, BIG, BLINK, BR, CITE, CODE, EM, FONT, I, IMG, KBD, NOBR, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TT, VAR, and WBR elements.
The STRONG element indicates that the browser should strongly emphasize the contained text.
There are no attributes. The STRONG element is a container element that may contain content text and A, B, BASEFONT, BIG, BLINK, BR, CITE, CODE, EM, FONT, I, IMG, KBD, NOBR, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TT, VAR, and WBR elements.
The SUB element specifies that the browser should render the contents as subscript.
There are no attributes. The SUB element is a container element that may contain content text and A, B, BASEFONT, BIG, BLINK, BR, CITE, CODE, EM, FONT, I, IMG, KBD, NOBR, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TT, VAR, and WBR elements.
The SUP element specifies that the browser should render the contents as superscript.
There are no attributes. The SUP element is a container element that may contain content text and A, B, BASEFONT, BIG, BLINK, BR, CITE, CODE, EM, FONT, I, IMG, KBD, NOBR, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TT, VAR, and WBR elements.
The TABLE element defines a table. It has ten attributes:
| ALIGN=string | The value specifies the alignment of the table. Valid values include bleedleft, left, center, right, bleedright, and justify. The default value is center. |
| BORDER=number | The value specifies the width of the border around the table. A value of 0 indicates no border. |
| CELLPADDING= number | The value specifies the width of the space, in pixels, between the contents of each cell and its border. The default value is 1. |
| CELLSPACING= number | The value specifies the distance between cells, in pixels. The default value is 2. |
| CLEAR=string | The value specifies that the browser should space down the page until the indicated margin is clear of text and images. The value may be left, right, or all. |
| ID=string | The value specifies a name that can be used in a fragment URL. |
| NEEDS=number | The value specifies the minimal width needed for this element. |
| NOWRAP | This attribute specifies that line wrap is disabled. |
| UNITS=string | The value specifies the units of measure. Valid values are em, pixels, and relative. The default value is em. An em is a printer's measurement, the width of the letter "M." |
| WIDTH=number | The value specifies the width of the table in pixels or as a percentage of the width that the browser would try to put it in. |
The TABLE element is a container element that may contain CAPTION and TR elements.
The TD element specifies the contents of a table cell. The TH element creates a header cell for a table. Typically, the browser will render the text of a TH element in a bold font; this is the only real difference between a TH element and a TD element.
The TD and TH elements have seven attributes:
| ALIGN=string | The value specifies the alignment that should be used for the data. Valid values are left, center, right, and justify. |
| COLSPAN=number | The value specifies the number of columns that this cell spans. |
| ID=string | The value specifies a name that can be used in fragment URLs. |
| NOWRAP | This attribute specifies that line wrap is disabled. |
| ROWSPAN=number | The value specifies the number of rows that this cell spans. |
| VALIGN=string | The value specifies the vertical alignment that should be used for the data. Valid values are top, middle, bottom, and baseline. |
| WIDTH=number | The value specifies the width in pixels or as a percentage of the calculated width that the cell data should be forced to occupy. |
TD and TH elements are container elements that may contain content text and A, ADDRESS, APPLET, B, BASEFONT, BIG, BLINK, BLOCKQUOTE, BR, CENTER, CITE, CODE, DIR, DIV, DL, EM, FONT, FORM, H1, H2, H3, H4, H5, H6, HR, I, IMG, KBD, MAP, MENU, NOBR, OL, P, PRE, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TABLE, TT, UL, VAR, and WBR elements. An interesting "gotcha" is that a TD or TH element containing an IMG element, and nothing else, must contain no line breaks in the source. In other words,
<TD> <IMG SRC="image.gif" WIDTH=4Ø HEIGHT=2Ø> </TD>
will result in spaces before and after the image. Usually the goal is to have the image fill the cell completely. Here is the right way to do it:
<TD><IMG SRC="image.gif" WIDTH=4Ø HEIGHT=2Ø></TD>
The TEXTAREA element defines an input field in which multiple
lines may be entered. It has eight attributes:
| COLS=number | The value specifies the number of columns for the text box. This attribute is mandatory. |
| NAME=string | The value specifies the name of the variable. This attribute is mandatory. |
| ONBLUR=string | The value specifies a JavaScript expression to be executed when the user moves focus from this element to another input field. |
| ONCHANGE=string | The value specifies a JavaScript expression to be executed when the user changes the data in the field and moves focus to another input field. |
| ONFOCUS=string | The value specifies a JavaScript expression to be executed when the user moves focus from another input field to this field. |
| ONSELECT=string | The value specifies a JavaScript expression to be executed when the user highlights some or all of the text in the field. |
| ROWS=number | The value specifies the number of rows for the text box. This attribute is mandatory. |
| WRAP=string | The value specifies how line wrap should be performed. Valid values include off, soft, and hard. The default value is off, meaning that lines are sent as entered. Soft wrap specifies that long lines are displayed with line wrapping, but the lines are sent as entered. Hard wrap specifies that long lines are displayed and sent with line wrapping. |
The TEXTAREA element is a container element that may only contain content text.
The TITLE element contains the document title, which is usually displayed in the browser window's decoration. It has no attributes, and is a container element that may only contain content text. You should limit the length of this element to 64 or fewer characters.
The TR element defines a table row. It has four attributes:
| ALIGN=string | The value specifies the alignment that should be used for the data. Valid values are left, center, right, and justify. |
| ID=string | The value specifies a name that can be used in fragment URLs. |
| NOWRAP | This attribute specifies that line wrap is disabled. |
| VALIGN=string | The value specifies the vertical alignment that should be used for the data. Valid values are top, middle, bottom, and baseline. |
The TR element is a container element that may contain TD and TH elements.
The TT element specifies that the browser should render the contents in a fixed width teletype font.
There are no attributes. The TT element is a container element that may contain content text and A, B, BASEFONT, BIG, BLINK, BR, CITE, CODE, EM, FONT, I, IMG, KBD, NOBR, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TT, VAR, and WBR elements.
The UL element creates a list that is not ordered. It has two
attributes:
| COMPACT | This attribute specifies that the browser should try to render the contents in a more compact way. |
| TYPE=string | The value specifies how the list items should be numbered. Valid values include disc (a filled circle), circle (an empty circle), and square. |
The UL element is a container element that may contain LI elements.
The VAR element specifies that the browser should render the contained text as a variable name.
There are no attributes. The VAR element is a container element that may contain content text and A, B, BASEFONT, BIG, BLINK, BR, CITE, CODE, EM, FONT, I, IMG, KBD, NOBR, SAMP, SMALL, STRIKE, STRONG, SUB, SUP, TT, VAR, and WBR elements.
The WBR element informs the browser where it can break a word. Unlike BR, it does not force a line break. You can use WBR elements within a NOBR element to dictate precisely where the browser may break a line and where it may not. The WBR element has no attributes and is an empty element.