HTML and CSS Reference
The first one that I just showed you is an element selector. To use this, simply specify the element type such as
p , h1 , input , ol , div , and so on. HTML5 introduces a large number of new tags that were added primarily with
CSS in mind. These context-specific elements like article , footer , and nav , communicate their purpose more
clearly, and therefore make it more likely that consistent formatting will be applied to all pages. These new
element types are:
article - a stand-alone portion of content such blog entry.
aside - content usually put to one side of the page; typically used for navigation or related
details - used for expandable content that can be hidden or displayed based on user input.
figcaption - used with figure to associate a caption with an image
figure - used to wrap embedded content such as an image or graphic
footer - the page or section footer
header - the page or section header
hgroup - used to group header elements like h1 , h2 , etc.
nav - used to contain a group of links
output - contains output such as the result of a user action
section - used to organize content in to logical sections
summary - usually used in conjunction with one or more details elements
If you want to apply the same declarations to more than one element type, you can group them like this:
p, h1, h2
The comma (“, ”) character serves as a logical OR operation. For example, all elements of type p OR h1 OR
h2 . This is just a special case of a selector combinator. You can also combine selectors to specify certain element
hierarchies. By combining elements with one of the following operators you can create a more complex selector:
• , - (e.g. p, h1 ) Selects all p elements as well as all h1 elements.
header p ) Selects the second element when it is inside the first element.
For example, if you want all p elements that are inside a header element, use header p .
he header element does not have to be the immediate parent, just somewhere in node's
• * - (e.g. header*p ) selects the second element when it is a grandchild or later descendant
of the first element.
• > - (e.g. header> p ) Selects the second element when the first element is the immediate parent.
he header> p selector returns all p elements whose parent (immediate) is a header element.
space - (e.g.