Chapter 5. Levels of CSS

In This Chapter

  • Building element-level styles

  • Creating external style sheets

  • Creating a multi-page style

  • Managing cascading styles

  • Using conditional comments

CSS is a great tool for setting up the visual display of your pages. When you first write CSS code, you're encouraged to place all your CSS rules in a style element at the top of the page. CSS also allows you to define style rules inside the body of the HTML and in a separate document. In this chapter, you read about these alternative methods of applying style rules, when to use them, and how various style rules interact with each other.

Managing Levels of Style

Styles can be applied to your pages at three main levels:

  • Local styles: Defined by specifying a style within an XHTML element's attributes.

  • Page-level styles: Defined in the page's header area. This is the type of style used in Chapters 1 through 4 of this minibook.

  • External styles: Defined on a separate document and linked to the page.

Using local styles

A style can be defined directly in the HTML body. Figure 5-1 is an example of this type of code. A local style is also sometimes called an element-level style, because it modifies a particular instance of an element on the page.

This page has styles, but they're defined differently than you've done before in this book.

Figure 5.1. This page has styles, but they're defined differently than you've done before in this book.

You can't see the difference from Figure 5-1, but if you look over the code, ...

Get HTML, XHTML, and CSS All-In-One Desk Reference For Dummies® now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.