HTML and CSS Reference
In-Depth Information
Understanding attributes
Attributes give you a way to specify additional information about
an element. While we haven't looked at attributes in detail, you've
already seen a few examples of them:
Th
e type
attri
bute s
pecifi
es whi
ch sty
le
lan
guage
we're
using,
in this
case
CSS.
<style type="text/css">
<a href="irule.html">
<img src="sweetphoto.gif">
Let's cook up an example to give you an even better feel for how
attributes work:
What if
<car>
were an element?
If
<car>
were an element, then you'd naturally want to write some
markup like this:
With
no attributes, a
ll we can supply
is a d
escriptive name
for the car.
<car>My Red Mini</car>
But with att
ributes, we can
customize the
element with
all kinds of in
formation.
But this
<car>
element only gives a descriptive name for your
car
—
it doesn't tell us the make, precise model, whether it is a
convertible, or a zillion other details we might want to know. So, if
<car>
were really an element, we might use attributes like this:
<car make="Mini" model="Cooper" convertible="no">My Red Mini</car>
Better, right? Now this markup tells us a lot more information in
an easy-to-write, convenient form.
SAFETY
FIRST
Do this (best practice)
<a href="top10.html">Great Movies</a>
Attributes are always written the
same way: first comes the attribute
name, followed by an equals sign, and then the
attribute value surrounded in double quotes.
You may see some sloppy HTML on the Web
that leaves off the double quotes, but don't get
lazy yourself. Being sloppy can cause you a lot
of problems down the road (as we'll see later in
the topic).
Not this
<a href=top10.html>Great Movies</a>
