建议的媒体查询尺寸，覆盖平板电脑、手机、笔记本电脑和台式机。

Question

建议的媒体查询尺寸，覆盖平板电脑、手机、笔记本电脑和台式机。

3

什么是最好的媒体查询尺寸，以确保您尽可能地针对平板电脑、手机、笔记本电脑和台式电脑进行了目标定位？

例如：iPhone和Droid的屏幕尺寸为320X480，因此在这些尺寸上确保设计外观良好是很重要的，因为许多手机的尺寸都是如此。还有哪些尺寸是需要针对的呢？我不仅仅是寻找iPhone/iPad的尺寸，而是一般情况下需要考虑。特别是现在Android设备比iOS设备更多，而且Android设备的尺寸也很多。

@media screen and (max-width: 480px) { /* 将针对Droid、iPhone 3等横向模式 */ }

@media screen and (max-width: 320px) { /* 将针对Droid、iPhone 3等纵向模式 */ }

- android.nick

2个回答

1

你可以看一下我的，http://dev.bowdenweb.com/a/css/media-queries-boilerplate.css 但是我大部分都是从硬煮的媒体查询中获取的，http://www.stuffandnonsense.co.uk/blog/about/hardboiled_css3_media_queries

- albert

在撰写本文时，第一个CSS文件不存在。 - Narretz

@Narretz 你确定吗？对我来说可行... - TryingToImprove

@TryingToImprove 我在2012年初失去了我的服务器。我已经尽可能地尝试复制它，但他可能在它宕机时看到了它。实际上，我认为他的评论是我缺失文档的线索。 - albert

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- XianStudio · Accepted Answer

这里有一个很好的屏幕尺寸链接。

因为iPad是目前最受欢迎的平板电脑设备，个人建议设计中等屏幕尺寸（1024x768）来满足该规格（iPad 2尺寸），如果超过这个尺寸，就会涉及到桌面尺寸。

对于智能手机尺寸，我建议选择960x640，但很可能在未来一年内，iPhone和Android的屏幕尺寸会增加。