Creating Style Sheets for Handhelds

You can create an entirely independent style sheet that will only be used for your Web page when it is viewed in a telephone, PDA or other handheld device.

Tips

The default value for media is all. So, unless you limit your main CSS document to the screen, it will be used in addition to your handheld CSS rules. (In this case, the style sheet that is called later overrules any earlier ones.) For more details, see page 133 in Chapter 8, Working with Style Sheet Files.
In the examples for the rest of this chapter, we'll be creating a separate and independent style sheet that does not use or depend on the main style sheet.
Not all handheld browsers respect the media attribute, and will erroneously read screen style sheets. Some do better with @import rules (see page 132).

Creating Style Sheets for Handhelds

Figure 13.6. Add the `screen` value to your regular style sheets so that their properties are not applied to your handheld style sheet.

Figure 13.7. Here's what our example looks like when pointed to a blank handheld style sheet. This document produced an error when it overloaded on the image files at the end of the document. We'll hide them on the next page.

Creating Style Sheets for Handhelds

Figure 13.6. Add the screen value to your regular style sheets so that their properties are not applied to your handheld style sheet.

Figure 13.7. Here's what our example looks like when pointed to a blank handheld style sheet. This document produced an error when it overloaded on the image files at the end of the document. We'll hide them on the next page.

Figure 13.6. Add the `screen` value to your regular style sheets so that their properties are not applied to your handheld style sheet.