Other
img tags in the page are unaffected by this rule because they aren??™t
contained within the "header" div. In this way, you can add a border
around just this image or set its margin to move it away from surrounding
elements.
We will get into learning to write CSS rules like this in greater detail
in the next chapter, but the important concept to understand is that
every element within the body of your document is a descendant
of the body tag, and, depending on its location in the markup, the
element could be an ancestor, a parent, a child, or a sibling of other
tags in the document hierarchy.
By creating rules that use (and often combine) references to IDs,
classes, and the hierarchy structure, you have means by which you
can accurately dictate which CSS rules affect which XHTML elements,
and this is exactly what you will learn to do next.
CHAP T E R 2
How CSS Works
27 STYLIN??™ WITH CSS
IN THE PREVIOUS CHAPTER, I showed you how XHTML
markup provides a structural hierarchy to your document. We
saw that elements have a basic set of styles applied to them
by the browser, and that each element is either displayed as
a block (stacked) or inline (side-by-side) element. If correctly
marked up, the document will then automatically lay out in
a useable way down the page??”an effect know as document
?¬‚ ow. However, ???useable??? doesn??™t mean ???beautiful,??? so CSS
enables creative people like you to change the browser??™s
default styles and apply additional styles to create a more
functional and aesthetically pleasing result for your visitors.
Pages:
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57