CSS - Media Types
CSS - Media Types
This feature of CSS allows presenting how the HTML document will be shown in different media like screen, handheld, print, aural, Braille, etc.
The different media (s) can be used as below,
All- it is applicable for all devices.
Aural- it is appropriate for speech synthesizer.
Braille- it is appropriate for Braille tactile feedback devices.
Embossed- applicable for paged Braille printers.
Handheld- applicable for handheld devices like monochrome, small screen, etc.
Print- applicable for documents in print preview mode.
Projection- applicable for projected presentations.
Screen- only applicable for color computer screen.
Tty- intended for media like terminals, teletypes or any portable devices.
Tv- only applicable for television-type media.
We can specify the media types using CSS by two different ways,
Using @media rule:
Example:
<style type=”text/css” >
<!—
@media print, screen {
body {line-height: 1.5 }
}
->
</style>
Using document language:
Example:
<html>
<head>
<style >
<link rel=”stylesheet” type=”text/css” media=screen, print href=”style.css”>
</style>
<body>
</body>
</html>
Here, style.css is an external style sheet.
