69 Slices
Medium 9780596009878

D. Specifying Color

Jennifer Niederst Robbins O'Reilly Media ePub

This appendix contains background information regarding specifying color that applies to both CSS properties and HTML attributes.

There are two methods for specifying colors in web documents: numeric RGB values and color names.

The most common and precise way to specify a color is by its numeric RGB (red, green, blue) values. Using RGB values, you can specify any color from the "true color" space (millions of colors). For an explanation of RGB color, see Chapter 28.

Using an image editing tool such as Adobe Photoshop, you can determine the RGB values (on a scale from 0 to 255) for a selected color. These are the RGB values for a particularly lovely spring green:

Color values are most often provided in a two-digit hexadecimal (base-16) form, not decimal, although these values may be used as-is in one CSS color format. Hexadecimal numbering is discussed in more detail in the next section. The same RGB values for that spring green look like this when converted to hexadecimal:

See All Chapters
Medium 9781449319274

A. Answers

Jennifer Niederst Robbins O'Reilly Media ePub

B, D, A, C

The W3C guides the development of web-related technologies.

C, D, A, E, B

Frontend design is concerned with aspects of a site that appear in or are related to the browser. Backend development involves the programming required on the server for site functionality.

A web-authoring tool provides a visual interface for creating entire web pages, including the necessary HTML, CSS, and scripts. HTML editors provide only shortcuts to writing HTML documents manually.

c;

j;

h;

g;

f;

i;

b;

a;

d;

e

There are a number of unknown factors when you’re developing a site:

The size of the screen or browser window

The user’s Internet connection speed

Whether the user is at a desk or on the go (context and attention span)

c;

d;

e;

a;

b

The four general disability categories include:

Sight impairment: make sure the content is semantic and in logical order for when it is read by a screen reader.

See All Chapters
Medium 9780596009878

20. Color and Backgrounds

Jennifer Niederst Robbins O'Reilly Media ePub

Once upon a time in 1993, when Mosaic was the only widely distributed browser in town, all web pages had black text on a gray background with blue hyperlinks and purple visited hyperlinks (unless the user changed it in the browser preferences to something more jazzysay, lime green on purple). Then in 1994, along came Netscape, and HTML extensions for coloring text and backgrounds were born. Even those limited controls came as a welcome relief to web designers and users clamoring for color.

CSS offers control over color and backgrounds that is worlds away from the effects possible with HTML extensions alone. This chapter introduces the properties for adding color and backgrounds to elements listed here.

color

background-position

background-color

background-attachment

background-image

background

background-repeat

Say goodbye to <font color=> forever. You can pitch the text, link, vlink, and alink attributes for the body element while you're at it.

The color property is used to describe the text (a.k.a. "foreground") color of an element. The foreground color is also used for an element's border unless it is specifically overridden with a border color rule.

See All Chapters
Medium 9781449319274

15. Floating and Positioning

Jennifer Niederst Robbins O'Reilly Media ePub

Floating

Clearing floated elements

Containing floats

Relative Positioning

Absolute Positioning

Fixed Positioning

At this point, you’ve learned dozens of CSS properties that allow you to change the appearance of text elements and the boxes they generate. But so far, we’ve merely been decorating elements as they appear in the flow of the document.

In this chapter, we’ll look at floating and positioning, the CSS methods for breaking out of the normal flow and arranging elements on the page. Floating an element moves it to the left or right, and allows the following text to wrap around it. Positioning is a way to specify the location of an element anywhere on the page with pixel precision.

We’ll start by examining the properties responsible for floating and positioning, so you’ll get a good feel for how the CSS layout tools work. In Chapter 16, we’ll broaden the scope and see how these properties are used to create common multicolumn page layouts.

See All Chapters
Medium 9780596527273

Specifying Color

Jennifer Niederst Robbins O'Reilly Media ePub

Because color is presentational, it should be specified with Cascading Style Sheets, not in the (X)HTML document. In both (X)HTML and CSS, color values may be provided by numeric values or standardized color names.

The most common and precise way to specify a color is by its numeric RGB (red, green, blue) values. Using an image-editing tool such as Adobe Photoshop, you can determine the RGB values (on a scale from 0 to 255) for a selected color. For example:

These values must be converted to their hexadecimal (base-16) equivalents in order to be used as attribute values. In this example, the previous decimal values are converted to hexadecimal.

In (X)HTML, these values are provided in a six-character string, preceded by the # symbol, like so:

The underlying syntax is this:

where RR stands for the hexadecimal red value, GG stands for the hexadecimal green value, and BB stands for the hexadecimal blue value.

See All Chapters

See All Slices