With media types a page can have one layout for screen, one for print, one for handheld devices, etc.
The style in the example below tells the browser to display a 14 pixels Verdana font on the screen. But if the page is printed, it will be in a 10 pixels Times font. Notice that the font-weight is set to bold, both on screen and on paper:
Other Media Types<html>
<head>
<style>
@media screen
{
p.test {font-family:verdana,sans-serif;font-size:14px;}
}
@media print
{
p.test {font-family:times,serif;font-size:10px;}
}
@media screen,print
{
p.test {font-weight:bold;}
}
</style>
</head>
<body>
....
</body>
</html>
all - Used for all media type devices
aural - Used for speech and sound synthesizers
braille - Used for braille tactile feedback devices
embossed - Used for paged braille printers
handheld - Used for small or handheld devices
print - Used for printers
projection - Used for projected presentations, like slides
screen - Used for computer screens
tty - Used for media using a fixed-pitch character grid, like teletypes and terminals
tv - Used for television-type devices
Posts
No comments:
Write comments