Jump to content

  • Free consultations and support
  • Live chatClick Here for Live Chat
  • Call ico 1888-906-1888
    Phone support: Open

    Ready for your call :)

    Our business hours:

    Mon — Fri, 2am — 8pm (EST)

    US & EU support teams

    Phone support: Closed

    We are back in: 1h 20m

    Our business hours:

    Mon — Fri, 2am — 8pm (EST)

    US & EU support teams


CSS Media Types

css media types

  • Please log in to reply
&nsbp;

#1 DesGuru

DesGuru

    Senior Member

  • Designer
  • 220 posts

Posted 08 November 2012 - 11:50 PM

Using media types in CSS you can have a page one layout for screen, another one for print, and one for devices, etc.. Some CSS properties are designed only for a certain medias and other properties can be used more than one media like screen and print media, but maybe with different values.

Ex. the @media Rule allows having a different style rule for each media inside the same style shoot.
In the example below the browser will display 16 pixels Times font on the screen. But The printing will be in 12 pixels Verdana font. The font is set to bold, for both screen and printin:
<html>
<head>
<style>
@media screen
{
p.test {font-family:Times,sans-serif;font-size:16px;}
}
@media print
{
p.test {font-family: verdana,serif;font-size:12px;}
}
@media screen,print
{
p.test {font-weight:bold;}
}
</style>
</head>

<body>
....
</body>
</html>

#2 ariyati

ariyati

    Junior Member

  • Designer
  • 4 posts

Posted 25 November 2012 - 06:40 PM

Is this method can be used to customize the display layout for various screen resolutions?

#3 HUH

HUH

    Member

  • Designer
  • 117 posts

Posted 26 November 2012 - 09:26 AM

Each CSS property definition specifies which media types the property applies to. Since properties generally apply to several media types, the "Applies to media" section of each property definition lists media groups rather than individual media types. Each property applies to all media types in the media groups listed in its definition.




1 user(s) are reading this topic

0 members, 1 guests, 0 anonymous users