What are the most important media query widths for all devices like desktops, tablets, laptops/Ipads, Iphones and Smartphones? Are there any standard widths for these devices?
相关问题
- Adding a timeout to a render function in ReactJS
-
Why does the box-shadow property not apply to a
- Add animation to jQuery function Interval
- jQuery hover to slide?
- Issue with star rating css
I'm looking everywhere for the best answer for this. Here what I found.
I think this is better considering with mobile first approach. Start from mobile style sheet and then apply media queries relevant for other devices. Thanks for @ryanve. Here is the link.
Try this Media Query it will help you
I find these are good breakpoints to start from but always test and tweak as you go. I'd also suggest using ems instead of px for dimensions for varied device dimensions and resolutions (reasons described here (http://blog.cloudfour.com/the-ems-have-it-proportional-media-queries-ftw/))
So the above queries would look like this:
There is also a nifty pixel to em calculator online here (http://pxtoem.com/) For those of you not as familiar, including myself.
Try this including retina