Используя Media queries по размеру экрана можно определить на какое iOS устройство загружена страница.
/* Desktop large × large */ @media all and (min-device-width: 1025px){ body:before{ content:"Desktop"; } } /* iPad 1024 × 768 */ @media all and (max-device-width:1024px) and (min-device-width:481px) and (orientation:landscape){ .ipad:before{ content:"iPad landscape"; } } @media all and (max-device-width:768px) and (min-device-width:321px) and (orientation:portrait){ .ipad:after{ content:"iPad portrait"; } } /* iPhone retina 640 × 960 */ @media all and (-webkit-min-device-pixel-ratio: 2) and (max-device-width:480px) and (orientation:landscape){ .iphone-retina:before{ content:"IPhone Retina landscape"; } } @media all and (-webkit-min-device-pixel-ratio: 2) and (max-device-width:320px) and (orientation:portrait){ .iphone-retina:after{ content:"IPhone Retina portrait"; } } /* iPhone 320 × 480 */ @media all and (max-device-width:480px) and (-webkit-max-device-pixel-ratio: 1) and (orientation:landscape){ .iphone-tft:before{ content:"IPhone TFT landscape"; } } @media all and (max-device-width:320px) and (-webkit-max-device-pixel-ratio: 1) and (orientation:portrait){ .iphone-tft:after{ content:"IPhone TFT portrait"; } }Источник
Комментариев нет:
Отправить комментарий