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.
