Besides singling out elements that are children of other elements, such as table cells inside of tables, we can also single out elements that follow other elements.
For example, our review includes a quote from the book immediately following a level one headline. If all our book quotes do the same, we can give that quote a unique appearance without going through each review and giving that blockquote element a special class.
Specify adjacent elements with the plus sign. The selector “h1+blockquote” means any blockquote element that follows an h1 element.
h1+blockquote {
font-family: VTypewriter RoyalDeLuxe, American Typewriter, Courier, sans-serif;
margin-right: 0;
margin-left: 10%;
}
This specifies a special font for that blockquote, as well as reduced its right margin from the default to zero, and set its left margin to 10% of the body’s width.
We might also want to give paragraphs an indent, but this is commonly only done for paragraphs that follow other paragraphs. Paragraphs that follow a headline or a quote don’t get indented. By selecting for “p+p”, we can apply our style properties only to paragraphs that follow a paragraph.
p+p {
text-indent: 1em;
}
Related Pages
