【问题标题】:Where Can I Learn How To Fit A Website To Fit Many Android Resolutions?我在哪里可以学习如何调整网站以适应许多 Android 分辨率?
【发布时间】: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


    【解决方案1】:

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

    【讨论】:

    • 谢谢。但是我怎么知道要制作多少这些额外的东西?比如,我是让一分钟高度 800,然后最小高度 400 还是什么?
    • 我应该对每个媒体查询进行全新的设计吗?
    • 多少个 CSS 取决于你;您应该定义哪种用户体验最适合任何解决方案;这个主题也被称为“响应式设计”;通常你为每个模板定义 3 个不同的布局,每个模板都有一个最大宽度;肖像或风景不应该很重要,除非有视觉元素需要最小高度才能正常工作。看看像这样的网站jyskebank.dk/wps/portal/jfo/forside 了解它应该如何工作
    猜你喜欢
    • 1970-01-01
    • 2022-06-15
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2016-08-20
    • 2022-08-17
    • 1970-01-01
    相关资源
    最近更新 更多