Learning Web Technology CSS Advanced Tutorials CSS2 Media type

css| Advanced | tutorials | Web page

Media type (media Types) allows you to define what media the document is submitted to. Documents can be displayed in a display, a paper medium, or an auditory browser, and so on.

Type of media

Some CSS properties are only designed to target certain media. For example, the "voice-family" attribute is designed to target auditory user terminals. Other properties can be used in different media. For example, the "Font-size" attribute can be used for display and print media, but may have different values. The displayed document on the monitor usually requires a larger font size than the paper media document, while the Sans-serif font is easier to read on the display, while the serif font is easier to read on the paper medium.

@media rules

@media rules give you the ability to use different style rules for different media in the same style sheet.

The style in the following example tells the browser to display a 14-pixel Verdana font on the monitor. But if the page needs to be printed, the 10-pixel times font will be used. Note: The font-weight is set to bold, whether the monitor or the paper media:

@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>
Different types of media

Note: The media type name is not case sensitive.

browser support :IE: Internet Explorer, F: Firefox, N: Netscape.

The number of the "CSS1" column shows the CSS standard definition of the attribute background (or CSS2).


 

 
  
 
   
 
    
type of media
 
    
Description
 
   
 
   
 
    
All
 
    
Used in all media equipment.
 
   
 
   
 
    
Aural
 
    
For speech and audio synthesizer.
 
   
 
   
 
    
Braille
 
    
Used Braille tactile feedback equipment for the blind.
 
   
 
   
 
    
Embossed
 
    
Braille Printer for pagination.
 
   
 
   
 
    
Handheld
 
    
For small hand-held devices.
 
   
 
   
 
    
Print
 
    
for the printer.
 
   
 
   
 
    
Projection
 
    
For presentation, such as slides.
 
   
 
   
 
    
Screen
 
    
For computer monitors.
 
   
 
   
 
    
Tty
 
    
A medium used to use fixed density letter grids, such as telex typewriters and terminals.
 
   
 
   
 
    
Tv
 
    
A device for a TV type.