How to target CSS for iPad but exclude Safari 4 desktop using a media query?

后端 未结 3 768
攒了一身酷
攒了一身酷 2020-12-05 03:11

I am trying to use a media rule to target CSS to iPad only. I want to exclude iPhone/iPod and desktop browsers. I would like to to also exclude other mobile devices if possi

相关标签:
3条回答
  • 2020-12-05 03:35

    This is a quite simlifying demonstration: http://css-tricks.com/snippets/css/ipad-specific-css/

    0 讨论(0)
  • 2020-12-05 03:50
     media="only screen and (device-width: 768px)"
    

    Thanks to Mislav Marohnić for the answer!

    This works for iPad in either orientation and seems to exclude desktop Safari.

    When I was testing (min-device-width: 768px) and (max-device-width: 1024px) I could see Safari 4 using the styles or ignoring them as I widened or narrowed the window. When testing (device-width: 768px) I tried to make the desktop Safari browser exactly 786px wide, but I never got it to see the styles.

    0 讨论(0)
  • 2020-12-05 03:52

    I use PHP to do that. I isolate the plateform from the USER_AGENT string. Then I only have to use a if($plateform == 'iPad') {.....} It's that easy!

    0 讨论(0)
提交回复
热议问题