媒体查询的推荐大小，涵盖平板电脑、手机、笔记本电脑和台式机
为了确保您尽可能地定位平板电脑、手机、笔记本电脑和台式机，最佳的媒体查询大小是多少？
例如：iPhone 和 Droid 的屏幕尺寸为 320X480，因此最好确保设计在这些尺寸下看起来不错，因为很多手机都是这个尺寸。还有哪些其他尺寸适合作为目标？我不只是寻找 iphone/ipad 的尺寸，而是一般的尺寸。特别是现在 Android 设备比 iOS 设备多，而且 Android 设备往往有多种不同的尺寸。
@media 屏幕和（最大宽度：480px）{ /* 将以 droid、iphone 3 等为目标景观。 */ }
@media 屏幕和（最大宽度：320px）{ /* 将针对 droid、iphone 3 等的肖像。 */ }
What are the best Media Query sizes to use to be sure you've targeted tablets, phones, laptops and desktops as best you can?
For example: The iPhone and Droid have a screen size of 320X480, therefore it would be good to make sure the design looks good at those sizes, since a lot of phones out there are this size. What other sizes would it be good to target? I'm not looking JUST for iphone/ipad sizes, but in general. Especially since there's more Android devices out there now than iOS devices, and Android devices tend to be of so many different sizes.
@media screen and (max-width: 480px) {
/* would target landscape for the droid, iphone 3, etc. */
}
@media screen and (max-width: 320px) {
/* would target portrait for the droid, iphone 3, etc. */
}
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
这里是一个关于屏幕尺寸的很好的链接。
就我个人而言，由于 iPad 是迄今为止最受欢迎的平板电脑设备，因此请根据该规格（iPad 2 尺寸）设计中型屏幕尺寸 (1024x768) - 任何大于该尺寸的屏幕尺寸都会接近桌面尺寸。
对于智能手机尺寸，我会选择 960x640，尽管 iPhone 和 Android 的尺寸可能会在明年（如果不是更早的话）增加。
Here is a great link to screen sizes.
Personally, since the iPad is by FAR the most popular tablet device, design the medium screen size (1024x768) to that specification (iPad 2 size) - any larger than that and you're running in to desktop size.
For Smart Phone size I would go with 960x640, although that will probably increase for iphone and android within the next year if not sooner.
你可以看看我的， http://dev.bowdenweb.com/a /css/media-queries-boilerplate.css 但我大部分都是从硬硬的媒体查询中获取的，http://www.stuffandnonsense.co.uk/blog/about/hardboiled_css3_media_queries
you can look at mine, http://dev.bowdenweb.com/a/css/media-queries-boilerplate.css but i took most of them from hard boiled media queries, http://www.stuffandnonsense.co.uk/blog/about/hardboiled_css3_media_queries