An Introduction to Element Attributes

In the previous tutorial we introduced the concept of elements and how HTML documents are made up of them, and how they can be nested. Elements identify a piece of the document as having certain meaning: the P element denotes a paragraph, the H1 element denotes a first-level heading and so on. Sometimes elements have other semantics as well, and that's where attributes come in.

Attribute Syntax

Attributes are written in an element's start-tag. They are separated by whitespace, and consist of a name and a value, separated by an equals sign. Let's take an example:

<SELECT SIZE="4" NAME="foo">
...
</SELECT>

The above is a SELECT element, which I haven't told you about, so don't worry about what it does yet. It has a start-tag and an end-tag, and some content which I'm omitting here.

It also has two attributes: A SIZE attribute which has the value of 4, and a NAME attribute which has the value of foo. What attributes mean depends on the type of element. Each element type has a list of possible set of attributes, and each attribute takes a certain kind of value. A SELECT element can have various attributes, one of which is SIZE, which accepts numerical values. It can also accept a NAME attribute that accepts text strings.

Note that both attribute values above are quoted using double quotes. You can quote attributes using either single or double quotes (single quotes are useful when the value itself contains double quotes), and it is recommended that you do so. It is not necessary, however, if the attribute values consist only of letters, digits, or the hyphen (-) and period (.) characters. To avoid confusion, however, it's better if you get used to quoting everything.

Boolean Attributes

Some attributes are used only to turn an element's specific behavior on or off. Such attributes are called boolean attributes. Boolean attributes only need to have a name. For instance, the following OPTION element (again, one you don't know about yet), has a VALUE attribute with the value option1 and has the boolean attribute SELECTED set.

<OPTION VALUE="option1" SELECTED>Option 1</OPTION>

Technically, there is an equivalent syntax for boolean attributes that sets their value as equal to their name. For example, the above is equivalent to this:

<OPTION VALUE="option1" SELECTED="SELECTED">Option 1</OPTION>

Some older user agents don't recognize this syntax, and there's no reason to do it in the first place anyway. But I'm merely mentioning this for the sake of completeness.

That's all the theoretical background you'll need for quite a while now. So now it's time to introduce the Anchor element.

Produced by Stephanos Piperoglou

All Rights Reserved. Legal Notices.

URL: https://www.webreference.com/html/tutorial2/6.html
Created: June 11, 1998
Revised: June 11, 1998