Come scegliere come target i CSS per iPad ma escludere il desktop di Safari 4 utilizzando una query multimediale?

Question

Sto tentando di utilizzare una regola multimediale per indirizzare i CSS solo su iPad. Voglio escludere i browser per iPhone/iPod e desktop. Mi piacerebbe anche escludere altri dispositivi mobili, se possibile.

ho usato

<style type="text/css" media="only screen and (min-device-width: 768px) and (max-device-width: 1024px)"> 

ma appena scoperto che desktop di Safari 4 lo legge. Ho provato con variazioni "481px" anziché "768px" ed un altro che aggiunge un orientamento che:

<style type="text/css" media="only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait)"> 

ma fortuna. (In seguito analizzeremo le stringhe user-agent per iPad, ma per ora quella soluzione non funzionerà.)

Grazie!

Aggiornamento: sembra che Safari desktop usi la larghezza e l'altezza dello schermo al momento e si conceda un orientamento di ritratto o paesaggio basato su quello. Non sembra che le larghezze e le altezze escluderanno i browser desktop (a meno che manchi qualcosa).

http://mislav.uniqpath.com/2010/04/targeted-css/

Answer 1

media="only screen and (device-width: 768px)" 

Grazie a Mislav Marohnić per la risposta!

Questo funziona per iPad in entrambi gli orientamenti e sembra escludere Safari desktop.

Quando stavo testando (min-device-width: 768px) and (max-device-width: 1024px) ho potuto vedere Safari 4 usando gli stili o ignorandoli mentre allargavo o restringevo la finestra. Durante il test (device-width: 768px) ho provato a rendere il browser Safari desktop esattamente 786px largo, ma non ho mai avuto modo di vedere gli stili.

Answer 2

Questa è una dimostrazione abbastanza simlifying: http://css-tricks.com/snippets/css/ipad-specific-css/

Answer 3

Io uso PHP per farlo. Io isolare la forma del piatto dalla stringa USER_AGENT. Allora devo solo usare un if($plateform == 'iPad') {.....} E 'così facile!