手机网页分辨率有标准吗?
大多数设计师使用 1024x768 作为网站开发的基准。这使得他们能够使用 960 和 960 等 css 网格系统。蓝图可轻松概述内容。手机设计是否有类似的基线分辨率?
大多数用户将使用 iPhone、Android 和黑莓手机。
Most designers use 1024x768 as a baseline for website development. That allows them to use css grid systems like 960 & blueprint to easily outline content. Is there similar baseline resolution for designing for mobile phones?
The majority of users will be using iphone, android, and blackberry phones.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(8)
320 x 480 是新型移动设备的常见屏幕分辨率。
iPhone 网站兼容性
Android 显示指标
也就是说,如果您想支持大多数移动设备,您可能想支持多种分辨率。
320 by 480 is the common screen resolution for new mobile devices.
iPhone Website Compatibility
Android Display Metrics
That being said if you want to support the majority of mobile devices, you may want to support multiple resolutions.
这个网站非常方便。各种设备及其屏幕规格的最新数据库。
This website is super handy. An up-to-date database of various devices and their screen specs.
如果您使用 apache ApacheMobileFilter 可以帮助确定实际设备屏幕尺寸
if you are using apache ApacheMobileFilter can help to determine the actual device screen size
您可以获得
对于 Android、iPhone 和 Blackerry 设备,屏幕尺寸没有太大差异。只要有一点远见和设计,您就可以让所有这些手机在一个移动网站上运行(例如,公平地说,宽度将是 240 像素或更大,并进行相应的设计)
但是,如果您计划走得更远这些平台上有一个充满伤害的世界在等着你(J2ME、BREW、Symbian、WinMo 和 120x160、176x220 屏幕尺寸等)
You can
With android, iphone and blackerry devices there is not large difference in a screen sizes. With a litle foresight and design you may be able to have all these handset work on one mobile website (for example it would be fair to say that the width would be 240 pixels or greater and design accordingly)
However if you plan to go further than there these platforms there is a world of hurt awaiting you, (J2ME, BREW, Symbian, WinMo and 120x160, 176x220 screen sizes etc)
我发现 https://www.mydevice.io/#compare-devices是确定此类事情的最佳网站。我一直在寻找相同的内容,并通过 Google 搜索找到了这个问题,但是上面提到的大多数其他网站都为您提供了设备像素,而不是 CSS/JS 像素,这是所有这些在 Web 开发中真正重要。
当然,iPhone 8 Plus 在其最窄的轴上可能有 1080 个实际像素,但这与当前的主题完全无关,例如考虑到这些像素比高清电视小得多。我想测量与浏览器实际呈现移动网站的方式相关的显示器宽度,而 mydevice.io 可以为您提供该宽度以及物理尺寸。赢赢! ;-)
I've found https://www.mydevice.io/#compare-devices to be the best site for determining this kind of thing. I was looking for the same and found this question via a Google Search, but most of the other websites mentioned above give you device pixels, not CSS/JS pixels, which is all that really matters in web development.
Sure, an iPhone 8 Plus may have 1080 actual pixels across its narrowest axis, but that is completely irrelevant to the topic at hand, considering that those pixels are much, much smaller than your HD TV for example. I wanted to measure the width of the display in relation to how a browser actually renders a mobile site and mydevice.io gives you that, as well as the physical dimensions. Win win! ;-)
简单地说,不。
这里有很多信息。 http://www.quirksmode.org/mobile/
设备太多,有太多不同的功能屏幕采用通用分辨率。虽然 320 x 480 确实可以在许多设备上找到,但它绝不是“常见”。你必须使用灵活的设计原则,然后使用媒体查询或js检测来添加一个类来将你的显示调整到合适的尺寸。这也是移动领域目前难以争论的部分原因。
Simply, no.
Lots of information here. http://www.quirksmode.org/mobile/
There are just too many devices with too many different screens to assume a common resolution. While it may be true that 320 x 480 can be found on many devices, it is by no means "common". You have to use flexible design principles and then use media queries or js detection to add a class to adjust your display to the proper dimensions. This is part of what makes mobile so difficult to wrangle right now.
是的,响应式网页设计尺寸有 1024 x 960 x 800 x 768 x 640 x 480 x 360 - 最好使用百分比来避免这种情况
yes there are 1024 x 960 x 800 x 768 x 640 x 480 x 360 for resposive web design sizes - better to go with percentages for avod this
我为移动设备编写游戏。在我的代码中,我按百分比定位所有内容,因为它们总是相同的,另外我还使用 var 来调整它们有多少像素,然后设置我的分辨率以适应您可以使用 css 做几乎相同的事情 您的资源中还有一些不同的图像尺寸。
I write games for mobile devices. In my code I position everything by percentage as it will always be the same, plus I also use a var to adjust how many pixels they have then set my resolution to suit You can do pretty much the same with css and a few different image size's in your resources.