Media Types
A useful feature of a stylesheet is that they can change the presentation of a page depending on what device the page is being viewed on. At the moment the most commonly used media types are for screen and print simply because it means that how a site looks on the screen won’t be how it prints out, so it makes it more user friendly and save on ink, but there are a lot of other media types that can be just as useful for your site.
How to apply a media type
There are a few ways that you could apply a media type to a style set:
External Stylesheet
<link href="default.css" rel="stylesheet" type="text/css" media="screen"/>
Inline style sheet
@media screen{
#nav { font-family:Arial, Helvetica, sans-serif;}
}
@media print {
#nav { display:none;}
}
Imported Stylesheet
<style type="text/css" media="print"> @import "print.css"; </style>
Below is a list of media types that are currently available to use
| Media Type | Used For |
|---|---|
| all | All media type devices |
| aural | Speech and sound synthesizers |
| braille | Braille tactile feedback devices |
| embossed | Paged Braille printers |
| handheld | Small or handheld devices |
| Printers | |
| projection | Projected presentations, like slides |
| screen | Computer screens |
| tty | Fixed-pitch character grid, like teletypes and terminals |
| tv | Television-type devices |


Socialise