Thursday 19th of January 2017 01:53:36 PM

Book Home

Cascading Style Sheets: The Definitive GuideSearch this book

Symbols | A | B | C | D | E | F | G | H | I | J | K | L | M | N | O | P | Q | R | S | T | U | V | W | X | Y | Z

Index: M

margin-bottom property: 7.3.4. Single-Side Margin Properties
margin-left property: 7.3.4. Single-Side Margin Properties
margin property: 7.3. Margins
margin-right property: 7.3.4. Single-Side Margin Properties
margin-top property: 7.3.4. Single-Side Margin Properties
margins: 7. Boxes and Borders
7.3. Margins
collapsing: 7.3.5. Collapsing Margins
block-level elements: Collapsing vertical margins
floated elements: 7.6.1. Floated Elements
horizontal, noncollapsing: 8.2.2. Horizontal Formatting
inline elements and: 7.3.7. Margins and Inline Elements
caution with: 7.3.8. Margins: Known Issues
length values and: 7.3.1. Length Values and Margins
negative (see negative margins)
vs. padding: 7.2. Margins or Padding?
percentages and: 7.3.2. Percentages and Margins
replication: 7.3.3. Replicating Values
single side, setting margin for: 7.3.4. Single-Side Margin Properties
table cells and: 1.3.1. Limited Initial Scope
markers: 8.2.3. List Items
8.2.3. List Items
10.4.2. Markers
matching hyphenated values: Matching hyphenated values
matching single attribute values: Matching single attribute values
max-height property: Limiting width and height
max-width property: Limiting width and height
media types: 1.3.1. Limited Initial Scope
10.8. Media Types and @-rules
Microsoft Internet Explorer (see Internet Explorer)
middle alignment: In the middle
millimeters (mm): 3.2.1. Absolute Length Units
min-height property: Limiting width and height
min-max properties: Limiting width and height
min-width property: Limiting width and height
monospace fonts: 5.1. Font Families
multiple pages, using styles on: 1.2.3. Using Your Styles on Multiple Pages

Symbols | A | B | C | D | E | F | G | H | I | J | K | L | M | N

Figure 6-55

Figure 6-55. Nailing the background in place

When printed, of course, the two are the same, since the display area(the paper) is the same as the document size, at least for that page.In a web browser, though, the viewing area can change as the userresizes the browser's window. This will cause thebackground's origin image to shift as the windowchanges size. Figure 6-56 depicts several views ofthe same document. So in a certain sense the image isn't fixedin place, but it will remain fixed so long as the viewing areaisn't resized. | O | P | Q | R | S | T | U | V | W | X | Y | Z

Library Navigation Links

Copyright © 2002 O'Reilly & Associates, Inc. All Rights Reserved.

6.1.1. Foreground Colors

Theeasiest way to set the foreground color of an element is with theproperty color.


This propertyaccepts as a value any valid color, as discussed in Chapter 3, "Units and Values", such as #FFCC00 orrgb(100%,80%,0%). It has the effect of setting the

Perhaps you want your H1 elements to be colored a shade of red somewhere between the values for red and maroon. red is simply rgb(100%,0%,0%), whereas maroon is more like (50%,0%,0%). In order to get a color between those two, you might try this:

H1 {color: rgb(75%,0%,0%);}

This makes the red component of the color lighter than that of maroon, but darker than that ofof effect was to fake it. Now all you need is alist-style-image declaration.


Yes, that's really all there is to it. One simpleurl value, and you're putting images in forbullets, as you can see in Figure 7-81.

Figure 7-81

Figure 7-81. Using images as bullets

the other CSS rules, or else it won't work at all.

<STYLE TYPE="text/css">@import url(styles.css); /* @import comes first */H1 {color: gray;}</STYLE>

Like LINK, there can be more than one@import statement in a document. UnlikeLINK, however, the style sheets of every@import directive will always be loaded and used.floated paragraph could literally be one character wide, assuming that to be the browser's minimum value for width. In order to avoid this problem, make sure that you declare a width for your floated elements. Otherwise, you could get something like Figure 7-66.

Figure 7-66

Figure 7-66. Floated text without an explicit width