Qua potete trovare l'elenco di tutte le CSS media query per i dispositivi piu' comuni per rendere il tuo sito responsive

In questo post voglio condividere il modo migliore per impostare le media query nel vostro CSS.

La maggior componente di un design responsive è creare la giusta esperienza per il giusto device. Ci sono ormai centinaia di differenti device nel marcato, con differenti risoluzioni, il chè non rende la vita facile. L’opzione migliore è trovare le media queries che possono essere usate per la maggior parte degli standard e per gli apparati più popolari.

Per definizione un breakpoint è un punto, su una linea ideale che parte da 0, in cui si verifica una qualche modifica (tramite i CSS) al layout della pagina. I breakpoint si definiscono con valori numerici e unità di misura nel contesto delle media queries inserite nei nostri fogli di stili CSS.

La scelta dei breakpoint non è la migliore per implementare un buon responsive design, le  media queries dovrebbero invice abbracciare un rage di risoluzioni, in altreparole da valore1 px a valore2 px.

Ecco di seguito tutte le media query che dovresti conoscere:

Phones and Handhelds

Tablets

Portatili

Orologi