Style sheets in action

You can use multiple external style sheets to serve up the site's existing content to a variety of users.

As an example, this is what the Engineering Library's Ask Us page looks like when it's displayed on a desktop computer or laptop, using the library's "screen media" style sheet (0engi.css):

screen shot of the Engineering Library's Ask Us page, as shown on a computer monitor

This is what the Engineering Library's "Ask Us" page looks like when it's displayed on a mobile phone emulator, using the library's "handheld media" style sheet (0engi_handheld.css). In the image on the left, note that there's a special text-based logo that would be displayed only on handheld devices. The center image shows some page content, with text and an image. The image on the right shows what part of the e-mail form looks like on this style of mobile phone.

three screen captures from a mobile device emulator showing the Engineering Library's Ask Us page

Note: both devices are loading the same web page! The style sheets are controlling how the content is displayed, and each device's web browser chooses which one to use.