Attributes

The scope of an HTML tag can be expanded by the use of attributes. Attributes are modifiers for an HTML tag, which change that tag's appearance, behavior, or activity. Any number of different attributes may be placed into a single tag; each attribute may appear only once per tag.

Attributes must use the following syntax:

attributename="value"

The attribute name comes first, followed by the = (equals) sign, then "" (quote/unquote) to contain the specific value for the attribute.

Generic Syntax Example:

<tagname>Marked text or content</tagname>

I could place one attribute into this tag in the following manner:

<tagname attributeone="value">Marked text or content</tagname>

Don't forget to place a single space between the tag name and the attribute name. If you run the tag name and the attribute name together without a space, the tag will break!

I could place several attributes into this tag, each attribute separated by one space:

<tagname attributeone="value" attributetwo="value2" attributethree="value3">Marked text or content</tagname>

Each attribute may appear only once per tag.

Note: Do NOT repeat attributes in the closing tag! The following example would be INCORRECT:

<tagname attributeone="value" attributetwo="value2" attributethree="value3">Marked text or content</tagname attributeone="value" attributetwo="value2" attributethree="value3">

Here are some real-world attribute examples, to make the concepts under discussion clearer.

Tag: P
Attribute: ALIGN
Value: left (default value), right, center
Description: The ALIGN attribute allows you to set the alignment for a paragraph of text on a page, whether to the left, right, or center.

Example:

<p align="right">Here is a right-aligned paragraph of text.</p>

<p align="center">Here is a center-aligned paragraph of text.</p>

<p>Here is a left-aligned paragraph of text; this alignment is the default for the P tag.</p>

Here are those paragraphs, displayed in your browser:

Here is a right-aligned paragraph of text.

Here is a center-aligned paragraph of text.

Here is a left-aligned paragraph of text; this alignment is the default for the P tag.

The ALIGN attribute also works with the heading tags, H1 through H6.

Tags: H1, H2, H3, H4, H5, H6
Attribute: ALIGN
Value: left (default value), right, center
Description: The ALIGN attribute allows you to set the alignment for a heading on a page.

Example:

<h2 align="center">Center-Aligned H2 Tag</h2>

<h2 align="center">Thumbelina Lilypads, Inc</h2>

Here are those center-aligned H2 tags, displayed in your web browser:

Center-Aligned H2 Tag

Thumbelina Lilypads, Inc

The ALIGN attribute is deprecated in HTML4 and XHTML, which means that it has been retired. Properties in CSS (Cascading Style Sheets) have replaced the ALIGN attribute under most circumstances. Until you learn a little CSS later in this course, however, you may use the ALIGN attribute. Once you have begun to use CSS, remember to STOP using the ALIGN attribute for paragraph and heading tags.

FYI: See "HTML and XHTML: The Definitive Guide", pp.69-75, if you are interested in more information on heading tags. Remember that the code samples given in the book do not follow strict coding practices.

Main Menu

Copyright © 2001 Michael Masumoto. All Rights Reserved.