HTML and CSS Reference
In-Depth Information
You can learn more about the CSS
display
property from the Mozilla Developer
2.1 specification (
w3.org/TR/CSS21/visuren.html#display-prop
).
Nesting Elements
Elements can be
nested
like Russian matryoshka dolls, each one residing within its containing element.
They must be nested correctly, with each end tag appearing in the correct order to close an inner element
before you close its container. Here's an example of some improperly nested elements:
<p><em>Hello, world!</p></em>
The
<em>
start tag occurs after the
<p>
start tag, but the
</p>
end tag occurs
before
the
</em>
end tag—
the
em
element here should be completely inside the
p
element. To ensure correct nesting of elements,
always close them in the reverse order in which you opened them:
<p><em>Hello, world!</em></p>
A browser may still be able to render improperly nested elements so you can't always count on the
mistake being obvious at a glance. A validator will catch these errors and keep you on the straight and
narrow. It can be a bit more challenging to track when nested elements begin and end if you choose to
omit end tags for those elements that allow it, so bear that in mind.
Global Attributes
We'll be listing each element's required and optional attributes as we introduce them individually
throughout this topic. However, some common attributes can be assigned to practically any element and
are almost always optional. To spare you the repetition, we'll cover these
global attributes
here, divided
into a few categories (they're also called
core attributes
). When we mention “global attributes” in later
chapters you can just refer back to this list—it's not going anywhere.
General Purpose Attributes
These attributes include general information about the element, and you can validly include them in the
start tag of almost any element:
class
: Indicates the class or classes to which a particular element belongs. Elements that belong
to the same class may share aspects of their presentation, and classifying elements can also be
useful in client-side scripting. Any number of elements may belong to the same class.
Furthermore, a single element may belong to more than one class, with multiple class names
separated by spaces in the attribute value (also note that a single class name can't contain
spaces).
id
: Specifies a unique identifier for an element. An ID can be almost any short label without
spaces, but it must be unique within a single document; more than one element cannot share the
same identifier.
