Created
June 28, 2010 10:49
-
-
Save jolantis/455690 to your computer and use it in GitHub Desktop.
targeting iPhone and/or iPad
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<link rel="stylesheet" media="all and (orientation: portrait)" href="/portrait.css"> | |
<link rel="stylesheet" media="all and (orientation: landscape)” href="/landscape.css"> | |
[option 1 - tested and working] | |
<link rel="stylesheet" media="only screen and (device-width: 768px) and (orientation: portrait)" href="/ipad-portrait.css"> | |
<link rel="stylesheet" media="only screen and (device-width: 768px) and (orientation: landscape)" href="/ipad-landscape.css"> | |
[option 2] | |
<link rel="stylesheet" media="only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation: portrait)" href="/ipad-portrait.css"> | |
<link rel="stylesheet" media="only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation: landscape)" href="/ipad-landscape.css"> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<link rel="stylesheet" media="only screen and (-webkit-min-device-pixel-ratio: 2)" type="text/css" href="/iphone-retina.css" /> | |
[In the Retina-specific CSS, load in 32x32 icons as background images and specifies their dimensions in CSS pixels as 16x16 using the background-size CSS property.] |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<link rel="stylesheet" media="only screen and (max-device-width: 480px)" href="/iphone.css"> | |
<link rel="stylesheet" media="only screen and (orientation: portrait)" href="/portrait.css"> | |
<link rel="stylesheet" media="only screen and (orientation: landscape)” href="/landscape.css"> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
[glossy] | |
<link rel="apple-touch-icon" media="screen and (resolution: 163dpi)" href="/iOS-57.png" /> | |
<link rel="apple-touch-icon" media="screen and (resolution: 132dpi)" href="/iOS-72.png" /> | |
<link rel="apple-touch-icon" media="screen and (resolution: 326dpi)" href="/iOS-114.png" /> | |
[matt] | |
<link rel="apple-touch-icon-precomposed" media="screen and (resolution: 163dpi)" href="/iOS-57.png" /> | |
<link rel="apple-touch-icon-precomposed" media="screen and (resolution: 132dpi)" href="/iOS-72.png" /> | |
<link rel="apple-touch-icon-precomposed" media="screen and (resolution: 326dpi)" href="/iOS-114.png" /> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment