【发布时间】:2012-09-09 07:55:27
【问题描述】:
基本上,我正在为安卓手机设计网站,但是,我发现这些手机有许多不同的分辨率。最大的问题是有些手机的高度为 800 像素,而其他手机只有 320 像素,哈哈。我假设我需要进行流畅的布局,但我仍然对如何让移动网站填满整个用户的屏幕并且如果它的 800 像素高与 320 像素高相比仍然看起来不错,我仍然感到困惑。
我创建了一个移动网站,但意识到使用模拟器在不同的 android 设备上看起来完全是废话(在某些设备上看起来像一个小图标)。
我发现这个堆栈溢出问题类似于我要问的问题:Tips for optimizing a website for Android's browser?
这个人说他使用 Meta 标签:HandheldFriendly 和视口,这对于考虑实际设备大小是有意义的,因此不会调整大小,但随后他提到了“CSS 媒体查询”。他举了这个 CSS 媒体查询的例子:
@import url(style-screen.css) screen;
@import url(style-small.css) print, handheld;
@import url(style-large.css) screen and (min-width: 801px);
@import url(style-small.css) screen and (max-width: 800px);
我假设这是针对不同屏幕尺寸的,但我仍然不明白他在做什么。我一直在寻找几个小时试图找到教程来向我展示如何基本上做到这一点,但是移动设备太新了,我认为那里没有很多资源,或者我错过了它们。我看过 android 网站,但它似乎是针对应用程序开发人员的,他们只是列出屏幕尺寸,但不知道如何让它们成为漂亮的网站来填满整个人的屏幕哈哈。
如果有人有任何教程或提示或链接,他们可以与我分享,以了解如何让移动网站填满整个手机(或接近它),而不是让我的移动网站看起来像一个小图标它。谢谢。
(当然,我还想添加一些经过优化的漂亮移动图像,但也不确定这会如何工作,那是否也很流畅?)
【问题讨论】:
标签: android html css android-layout mobile