android - 我在哪里可以了解如何使网站适应多种 Android 分辨率?

标签 android html css android-layout mobile

基本上,我正在为 Android 手机设计网站,但是,我发现这些手机有许多不同的分辨率。最大的问题是有些手机的高度为 800px 而其他手机只有 320px 哈哈。我假设我需要进行流畅的布局,但我仍然对如何让移动网站填满整个用户的屏幕感到困惑,并且如果它的高度为 800 像素而不是 320 像素,它仍然看起来不错。

我制作了一个移动网站,但使用模拟器后发现它在不同的 Android 设备上看起来完全是垃圾(在某些设备上它看起来像一个小图标)。

我发现这个堆栈溢出问题与我要问的类似:Tips for optimizing a website for Android's browser?

此人说他使用 Meta 标签:HandheldFriendly 和视口(viewport),这对于考虑实际设备大小是有意义的,因此它不会调整大小,但随后他提到了“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 网站,但它似乎是针对应用程序开发人员的,他们只列出屏幕尺寸,但不确定如何让它们成为漂亮的网站来填满整个人的屏幕,哈哈。

如果有人有任何教程或提示或链接,他们可以与我分享以了解如何让移动网站填满整个手机(或接近它),而不是我的移动网站看起来像一个小图标它。谢谢。

(我当然也想添加一些经过优化的漂亮移动图像,但也不确定它是如何工作的,它也会流畅吗?)

最佳答案

css3和媒体查询适合你的需求;一些信息 here

关于android - 我在哪里可以了解如何使网站适应多种 Android 分辨率?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12337421/

相关文章:

android - 选择的 Kotlin AutoCompleteTextView 适配器项目提供不同的值

安卓狗应用布局

android - 配置更改时为空对象引用

JavaScript 循环不起作用?

html - HTML 表单中的“浏览”按钮在 IE 7 或 8 (ietester) 中不起作用

javascript - 如何将多个变量传递给 HTML/PHP 中的 JavaScript 函数?

java - 作为 apk 安装时,retrofit2 连接抛出错误

html - CSS 按钮样式不适用

css - 将 div 推到父级的底部

javascript - 将网页调整为 div