LinkBack URL
About LinkBacks
CSS Media Types
Media Types allow you to specify how documents will be presented in different media. The document can be displayed differently on the screen, on the paper, with an aural browser, etc.
Media Types
Some CSS properties are only designed for a certain media. For example the "voice-family" property is designed for aural user agents. Some other properties can be used for different media types. For example, the "font-size" property can be used for both screen and print media, but perhaps with different values. A document usually needs a larger font-size on a screen than on paper, and sans-serif fonts are easier to read on the screen, while serif fonts are easier to read on paper.
The @media Rule
The @media rule allows different style rules for different media in the same style sheet.
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:
Code:<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>
Reply With Quote
