TEXT TAGS AND A LITTLE CSS3 - HTML5 - page 58

CSS3 IDs
A CSS3 ID is set up almost exactly like a class except that it uses a pound sign ( # ) instead of a
dot ( . ) in the dei nition. Further, in assigning an ID, you use ID instead of class to specify
which ID to use with an element. You even can use IDs and classes with the same element.
h e following tag is perfectly correct:

< p ID = ”this” class = ”that” >

Both can select styles, and the ID provides a unique ID for the paragraph.

h e ID has some major dif erences from a class. Both a class and an ID can be used as style
sheet selectors. However, an ID has some other limitations and features:

An ID can be used only once in a document.
An ID can serve as an anchor (see Chapter 7).
An ID can act as a script reference. h at's important for JavaScript.
An ID can be used as a name in a declared object element — more stuf from JavaScript.
An ID can be used by agents for processing information in translating an HTML
document.

Of these features, you'll be using only the i rst two until you decide to incorporate JavaScript
and other languages into your résumé. Nevertheless, if you pay attention to these dif erences,
your Web pages won't run into problems later on (and others will think you're a pro). h e
following example ( IDwork.html in this chapter's folder at www.wiley.com/go/
smashinghtml5 ) shows a use of the ID with CSS3:

62

<! DOCTYPE HTML >
< html >
< head >
< style type = ”text/css” >
#littleHead {
font - family : Verdana , Geneva , sans - serif ;
background - color : #9FC;
font - size : 16px ;
}
#javascript {
/* red */
color : #cc0000;
}
#php {
/* blue */
color : #009;
}
#actionscript {
/* green */
color : #063;
}