Har noen spørsmål angående de nye retina displayene til både iPad, Macbook og iPhoner + alle andre høy PPI skjermer. De har med optimisering av en webside i CSS og hvordan jeg kan spesifisere sidene til ethvert display.
Jeg skrev spørsmålet mitt opp her uten lykke og lurer derfor på om noen freakere kan hjelpe meg?
CSS koden er følgende:
Hvorfor får jeg da fargekoden #117700 i bakgrunn når iPad Mini 2 retina er i portrait modus og #770029 når den er i landscape? Har ikke denne tableten en resolution på: 2048x1536?'
Har dette i HTML'en min:
Dersom du vil se siden jeg prøver dette på ligger den her
Jeg skrev spørsmålet mitt opp her uten lykke og lurer derfor på om noen freakere kan hjelpe meg?
CSS koden er følgende:
Kode
/** RETINA iPad **/
@media
screen and (-webkit-min-device-pixel-ratio: 1.5),
screen and (-moz-min-device-pixel-ratio: 1.5),
screen and (-o-min-device-pixel-ratio: 1.5),
screen and (min-device-pixel-ratio: 1.5){
body {
background-color: #486ffd;
}
}
/** 1600px screen **/
@media screen and (max-width: 1600px){
body {
background-color: #770029;
}
}
/** 1000px Screen **/
@media screen and (max-width: 1000px){
body {
background-color: #117700;
}
}
/** 500px screen **/
@media screen and (max-width: 500px){
body {
background-color: #ffce00;
}
}
/** 300px screen **/
@media screen and (max-width: 300px){
body {
background-color: #770200;
}
}
Har dette i HTML'en min:
Kode
<meta name="viewport" content="width=device-width; initial-scale=1; maximum-scale=3;" />
