HTML and CSS Reference
In-Depth Information
Document Structure and CSS Inheritance
As discussed in Chapter 1, (X)HTML documents have an implicit structure. The structure of
the document is generally presented as a tree, as you have seen in a number of the examples
in this chapter. For example, the document shown here would have a tree structure like the
one shown in Figure 4-9:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>
Test File
</title>
</head>
<body>
<h1>
Test
</h1>
<p>
This is a
<strong>
Test
</strong>
!
</p>
</body>
</html>
In the example parse tree, note how the
<strong>
tag is a child of the
<p>
tag, which is
in the
<body>
, which is in the
<html>
tag. What happens if you set a style rule to
p
elements, as follows?
p {color: red;}
doctype
html
head
meta
title
body
h1
p
strong
F
IGURE
4-9 Simple document parse tree
