HTML and CSS Reference
In-Depth Information
Part IV
Advanced CSS Techniques
From this point onward, we dive into more advanced subjects. Advanced doesn't necessarily mean the
techniques are difficult. In fact, many of them, such as newspaper-style multi-column layout in Chapter 18,
are quite simple. But with each new chapter, we increasingly leave behind legacy browsers. With the
exception of Chapters 14 and 16, nothing in Part IV works in IE 6 or IE 7. Also IE 8 is increasingly left
behind. However, that doesn't mean you can't incorporate these techniques into your designs. Make sure
that your content is accessible in all target browsers, and then use the new CSS3 features to enhance the
experience for users of more modern browsers.
Chapter 13 completes your knowledge of CSS3 selectors. Most of them are pseudo-classes that let
you target styles at elements more precisely without the need for extra HTML markup.
Chapter 14 shows how to make data tables attractive by controlling borders, backgrounds, and
padding. You'll also learn how to pimp up a table in modern browsers with border images.
Automatic content generation using the ::before and ::after pseudo-elements is the subject
of Chapter 15. One of its most useful applications is displaying the URL of a link when the web page
is printed. You can also automatically number sections of a page, or use generated content for more
whimsical purposes, such as ribbon effects and speech bubbles.
Chapter 16 describes how to create a separate style sheet for printing web pages, something that
many designers forget to do.
Media queries (see Chapter 17) lie behind one of the most important shifts in recent years—
responsive web design, where page layout adapts to the size and resolution of the screen. Even though
they're not supported by IE 8 and earlier, you'll learn how to deliver styles optimized even for legacy
browsers.
Chapter 18 shows how to flow text from one column to the next like in a newspaper or magazine
using CSS3 multi-column layout.
In Chapter 19, you'll learn how to create gradients without images.
Chapters 20 and 21 explore simple animations using CSS3 transforms, transitions, and keyframes.
Finally, Chapter 22 takes an in-depth look at CSS3 flex layout, showing you how to create equal-
height columns and display elements in a different order from the underlying HTML. The chapter also
takes a brief look at other CSS3 features that should start arriving in browsers in the near future.
 
Search WWH ::




Custom Search