O'Reilly logo

Web Design in a Nutshell, 2nd Edition by Jennifer Niederst Robbins

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Selectors

Selectors are the parts of the rule that identify the element (or elements) to which the style will be applied. There are several methods for identifying elements.

Type Selector

The simplest type of selector calls an HTML element by its tag, as shown:

H1 {color: blue}
H2 {color: blue}
P {color: blue}

Type selectors can be grouped into comma-separated lists so a single property will apply to all of them. The following code has the same effect as the previous code:

H1, H2, P {color: blue}

<div> and <span>

Two HTML elements, div and span, are generic identifiers ideal for use with style sheets. These elements have no inherent formatting properties of their own, but they can be used to designate elements on a web page that should be affected by style sheet instructions. These instructions are ignored by browsers that do not understand them.

The <div> tag is used to delimit block-level tags and can contain other HTML elements within it:

                     <DIV STYLE="color: blue">
<H1>Headline!</H1>
<P>This is a whole paragraph of text.</P>
</DIV>

The <span> tag is used inline to change the style of a set of characters:

<P>This is a paragraph and <SPAN STYLE="color: blue">>this area will be 
treated differently</SPAN> from the rest of the paragraph</P>

When used with the class and id attribute selectors (discussed later in this chapter), these tags can be used to create custom-named elements, sort of like creating your own HTML tags.

                        

Contextual Selectors

You can also specify style attributes ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required