Media query
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 |
/* Link */ <head> <link rel="stylesheet" href="small.css" media="screen and (max-width:480px)"> <link rel="stylesheet" href="medium.css" media="screen and (min-width:480px) and (max-width:1024px)"> <link rel="stylesheet" href="wide.css" media="screen and (min-width:1024px)"> </head> /* for iPhone Landscape */ @media screen and (min-width:480px) { } /* for iPad */ @media screen and (min-width:768px) and ( max-width:1024px) { } /* for PC */ @media screen and (min-width:1024px) { } /* Retina */ @media screen and ( max-width:768px) and (-webkit-min-device-pixel-ratio:2){ p {font-size: 1.2em; } } //portrait @media screen and ( max-width:768px) and (orientation:portrait){ p {font-size: 1em; } } //landscape @media screen and (orientation:landscape){ p {font-size: 1.2em; } } |
comment
go to related tags archive?
SEARCH ARTICLES
in this site
TAG CLUSTER
LATEST COMMENT
in this site
No comment yet.