问题标签 [responsive-design]

我们正处于为我们的一位客户构建移动网站的初始规划阶段。这个移动站点将是我们已经为他们建立的主站点的补充。我们已确定内容将是主站点的一小部分，并将针对预期使用该站点的主要受众。

在浏览一些示例移动网站时，我们注意到很多网址中包含 WAP 的网站实际上只是简化的 HTML 文件。 http://wap.mlb.com并没有真正启用 WAP，而是简单的 HTML。

我的问题是WAP想想过去？随着智能手机和 iPhone 能够按原样呈现网站，我们是否需要担心 WML 和 WAP，或者精简的 html 版本就足够了吗？

您还可以推荐博客或教程或回答以下如何最好地检查移动设备吗？作为程序员，我们是否需要了解用户代理的每个变体才能将它们重定向到我们的移动站点？

最后，您会为 iPhone/Touch Safari 浏览器编写一个移动站点，还是直接保留该站点？

我用 900 x 600 的固定背景图像设计了我的网站。在电脑上看起来不错。它在 PDA 设备上看起来如何？我需要为 PDA 单独设计吗？

应该如何检查我的网站是否可以通过手机有效浏览？

我应该怎么办？

我想创建一个div可以随着窗口宽度的变化而改变其宽度/高度的。

是否有任何 CSS3 规则允许高度根据宽度变化，同时保持其纵横比？

我知道我可以通过 JavaScript 做到这一点，但我更喜欢只使用 CSS。

我正在创建一个站点，我应该为不同的设备（pc、ipad、iphone）使用不同的 css 有可能知道人们使用哪个设备来选择 css ？？？

我创建了一个用于登录的 html 页面，其中包含页面左上角的用户名和密码字段。然后，我希望在 Android 模拟器浏览器中查看此页面时，只有原始页面的左上角部分应该填满整个页面。我该怎么做？如何使网页与移动浏览器兼容。

是否可以设置与宽度相同的高度（比例 1:1）？

例子

CSS

IE8 是否不支持以下 CSS 媒体查询：

如果不是，另一种写作方式是什么？在 Firefox 中也可以正常工作。

下面的代码有问题吗？

我正在围绕“响应式设计”概念开发一个网站，但是 facebook 社交插件是静态宽度，并且在调整大小时会“破坏”布局。

使用媒体查询，我将插件设置为隐藏在低分辨率浏览器（移动设备等）上。然而，在桌面浏览器上，当浏览器窗口变小，但又没有小到隐藏插件时，它们会脱离布局。

有什么方法可以为 Facebook 社交插件设置流体宽度？

具有百分比宽度的 html 元素需要具有其内部静态内容的最小宽度

您好，我正在尝试创建一个流畅/响应式布局。有没有办法强制具有百分比宽度的 html 元素具有其内部内容的最小宽度？也就是说，如果它的内部内容有某种静态宽度，比如 200px？

这是一个例子： http: //www.nathanielkessler.com/div/csshelp.html

如果在 IE9 中将其设置为 Quirks 模式并调整窗口大小，它的行为与我想要的完全一样。（注意当屏幕向内调整大小时，右侧的第二个 div 是如何弹出到左侧的第一个 div 之下的）。

如果您将文档设置回 IE9 标准模式，然后向内调整大小，您会看到外部红色边框 div 不尊重其内部内容（黄色框）。我只是继续缩小超出它的边界。
有没有办法让它像在怪癖模式下一样？（没有 JavaScript）

为了使我的网站更具响应性，我正在尝试学习如何流畅地定义元素。今天我遇到了一个我终于修复的情况，但我不明白为什么修复工作，我想。

我无法链接到该网站 (NDA)，但我已经提供了一些包含相关元素的示例页面：

错误：http ://cruxwire.com/wrong.html 正确：http://cruxwire.com/right.html

我所拥有的是向左浮动的三个 div。我正在尝试向它们添加填充（以百分比形式）并使用 target/context=result，然后使用 *100（因为它是百分比。）

我的 Ethan Marcotte 的响应式网页设计副本说：“在元素上设置灵活填充时，您的上下文是元素本身的宽度。” 我给了 div 的 20% 的宽度。由于父元素是945px，所以每个div的像素宽度是189px。我想添加 20px 的填充，所以 20/189=0.1058201058201058。我为每个 10.58201058201058% 的 div 添加了一个填充。

这最终为每个 div 提供了 100 像素的填充，而不是 20 像素。我最终意识到填充是根据父元素的宽度计算的，而不是 div 本身。

我的解决方案是在每个现有的 div 周围放置一个额外的 div，这样我就可以将宽度应用于一个，将填充应用于另一个，这样就解决了问题。

为什么填充计算相对于其父元素而不是其自身元素？

我怎样才能做到这一点而不必添加额外的 div？

你可以在这篇文章链接的页面上看到代码，我也在下面添加了它。

错误的：

正确的：