join: new@juude

get alerts for new articles


join: new@juude

get alerts for new articles

css: casscading style sheets

CSS Basics w3c

intro | media-types | reset/setup
RULES:  css | cascading | @rules
SELECTORS: selectors | properties/values

Media Types

In addition to creating style sheets for documents that are rendered by browsers, style sheets for other media can be created and read by a variety of agents. For some time we have been able to create a separate style sheet for different types of media.

For instance you can select fonts that are suitable for print, change colors that work better for projectors, get rid of images and menus or whatever is needed to make the document more readable for a particular device.

Linking to Different Style Sheets

When linking to specific style sheets you need to indicate the media within the link. Below are links to style sheets for the screen and print:

<link rel="stylesheet" type="text/css" media="screen" href="screen.css">
<link rel="stylesheet" type="text/css" media="print" href="print.css">

@import rule

In order to prevent the user agent from retrieving resources for unsupported media types you can specify media-dependent @import rules within your css.

@import url("name.css") print;
@import url("name.css") projector;