An element is the most basic part of HTML.
An element consists of a
start-tag, an end-tag, and the data characters enclosed by the two
tags. A
tag starts with a less-than (<) sign and ends with a greater-than
(>) sign.
An end-tag consists of the tag name immediately preceded by a slash
(/).
Some tags require that you always provide the matching end-tag; others
allow you to omit the end-tag if the result is clear and unambiguous.
For
example, here is a sentence that will display in bold:
<B>This sentence displays in bold.</B>
This example is an HTML element. The start-tag is <B>. The end-tag
is
</B>. The data characters are "This sentence displays in bold."
This
element, when read by your web browser, will turn on bold formatting,
based on the start-tag, and display the data characters in bold. The
end-tag switches off the bold formatting. Many elements can be "nested"
by placing an entire element inside the tags of another. For example,
here
is some italicized text placed inside a bold element:
<B>This sentence,<I>as written</I>, displays in bold.</B>
The <I>as written</I> element displays in both bold and italic
because it
is nested inside a bold element.
An element can have one or more attributes. An attribute is a parameter
associated with an element that extends its meaning. Tags and attribute
names are not case-sensitive, but they are typically written in uppercase
to distinguish them from the data characters.
This is a very simple HTML document:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">lt;HTML>
<HEAD>
<TITLE>Simple HTML Document</TITLE>
</HEAD>
<BODY>
<P>A very simple HTML document.
</BODY>
</HTML>
Every HTML document begins with the !DOCTYPE element. !DOCTYPE
specifies to the browser which version of HTML is being used.
The next element in this basic document is HTML, which informs the
browser that the content of the file is written in HTML. The matching
end-tag (</HTML>) is the last tag in the file.
The HEAD tag marks the beginning of the document header. The document
header describes the elements that apply for all sections of the current
document and any documents that contain content or are related to this
document. Typically, the TITLE element appears in the header. Internet
Explorer displays the text of the TITLE element in its title bar. A
menu bar
or image that is repeated for other documents may appear in the header
section.
The BODY element appears at the start of the main content of the
document. The BODY element encloses the body text, images, and
multimedia objects. The P element inserts a new paragraph with a carriage
return and line feed. The end-tag, </P>, is typically omitted.
With HTML, you can create hyperlink jumps between your documents. A
hyperlink is any text or image that, when clicked, loads another document
or another section of the current document into the Internet Explorer
window. The A element, or anchor, associates text or a graphic to another
document or to a location within the current document. A hyperlink
appears as a clickable "hot spot" (the clickable text or image). To
create a
hyperlink, you enclose the text or image with the anchor tags and set
the
HREF= attribute to the destination address, as in the following:
<P>Click <A HREF="//www.microsoft.com/">here</A> to visit the
Microsoft Web site.
In this example, the address for the Web site is enclosed in double
quotation marks. The double quotation marks are optional unless the
attribute value contains spaces. If you enclose a value that contains
double quotation marks, use " for each occurrence of the mark
within the value.
For example, you can create a hyperlink destination (anchor spot) within
your HTML document by using the NAME= attribute. Use the A element
to
relate text or a graphic to a name that you create. Then reference
the
name with a hyperlink. In the following example, the first line creates
the
named reference. The second line in the example includes a hyperlink
with
a jump to that place in the document.
<A NAME="using"></A><H2>Using HelpQuarters</H2>
...
<P>For more information, see <A HREF="#usinghq">Using HelpQuarters</A>
When you click the hyperlink "Using HelpQuarters", you jump to the
named reference, usinghq.
Note Although your web browser can display incomplete or improperly
tagged files, the result is often not what you may have intended. You
should always use the tags carefully, using them only in the context
in
which they are defined to be used and omitting end-tags only if they
are
defined as optional.
The typical HTML document consists of one or more text paragraphs
organized into sections. You can mark the beginning of the sections
in
your HTML documents by using the header Hn element, where "n" is a
number from 1 to 6 (1 creates the highest level heading and uses the
largest font size). These elements create headings by applying changes
to
the size and style of the text to indicate the section level. The specific
heading format can be controlled by using attributes or a style sheet;
otherwise, it takes the default formatting. The following example creates
a
first-level section heading:
<H1>Welcome to HelpQuarters!</H1>
The Hn element allows for six levels; you specify the level by using
the
element name that includes that level number (H1, H2, H3, and so on).
The end-tag is always required.
By default, section headings are left-aligned. You can override the
default
alignment and center the heading by using the ALIGN= attribute, as
in the
following example:
<H2 ALIGN=CENTER>How to Use HelpQuarters</H2>
In addition to using the P element to create simple paragraphs, you
can
use elements, such as BLOCKQUOTE, LISTING, PLAINTEXT, PRE, and XMP,
to create paragraphs that use a different size and style for the text.
For
example, you can use the PRE element to display characters in a
fixed-width font rather than the variable-width font used for simple
paragraphs, or the BLOCKQUOTE element to slightly indent the paragraph
text (from both the left and right margins) to make the paragraph stand
out.
You can apply a style to a sequence of paragraphs (for example, those
tagged with P) by enclosing the paragraphs with an ADDRESS,
BLOCKQUOTE, or CENTER element. The following example shows how to
center a sequence of simple paragraphs:
<CENTER>
<P>This paragraph is centered.
<P>And this paragraph is centered too.
</CENTER>
An alternate way to center individual paragraphs is to use the ALIGN=
attribute with the P element and set the attribute value to CENTER,
as in
the following example:
<P ALIGN=CENTER>This paragraph is centered.
This displays as:
This paragraph is centered. |
