CSS media types
A great thing about style-sheets is that you can specify how a document should look for different media types i.e. on a screen or when printed. The reason for this is that certain font sizes and fonts will be more suitable to certain media types.
You specify the CSS media type in the head section in the link to the css file:
style type="text/css" media="screen">
@import url( http://www.flickaswitch.com/style.css );
The type of media specified above is for screen.
You can use anyone of the following media types:
- all
- Suitable for all devices.
- aural
- Intended for speech synthesizers.
- braille
- Intended for braille tactile feedback devices.
- embossed
- Intended for paged braille printers.
- handheld
- Intended for handheld devices (typically small
screen, monochrome, limited bandwidth). - Intended for paged, opaque material and for documents viewed on
screen in print preview mode. - projection
- Intended for projected presentations, for
example projectors or print to transparencies. - screen
- Intended primarily for color computer screens.
- tty
- Intended for media using a fixed-pitch character grid, such as
teletypes, terminals, or portable devices with limited display
capabilities. - tv
- Intended for television-type devices (low
resolution, color, limited-scrollability screens, sound available).
CSS2 defines the following media groups:
* continuous or paged. “Both” means that the property in question applies to both media groups.
* visual, aural, or tactile.
* grid (for character grid devices), or bitmap. “Both” means that the property in question applies to both media groups.
* interactive (for devices that allow user interaction), or static (for those that don’t). “Both” means that the property in question applies to both media groups.
* all (includes all media types)