问题标签 [responsive-design]

我今天查看了http://mediaqueri.es/，发现这些网站非常适合移动设备。所以我想知道是否将 jQuery Mobile 和带有媒体查询的响应/自适应布局一起使用是多余的，因为仅使用媒体查询似乎是一个好方法。这真的是多余的还是我因咖啡因而绊倒？

编辑

示例：我看不出这个网站如何从使用 jQuery Mobile 中受益，因为它使用媒体查询做得很好。

公平地说，我看不到这个网站没有 jQuery Mobile，呵呵。在没有 jQuery Mobile 的情况下重现“本机应用程序”的外观和感觉会很困难，这是正确的吗？

我正在使用以下 CSS 声明：

存档：

它基本上是一个流体布局，除了中间的缩略图（它们只是部分流体）。我意识到使元素堆叠的唯一方法是定义它们的宽度（在这种情况下min-width）。

现在，当浏览器的窗口达到这个大小时：

右边还有空间。

我想知道是否可以让图像填充右侧的空间？

编辑：我是否应该根据屏幕分辨率的趋势（例如 ipad、android、iphone）来定义 div 的宽度？

这是主题全尺寸的时候：

当浏览器的窗口变小时，侧边栏会移到底部，主要内容会占据整个布局：

我认为这是解决问题的 CSS：

（不太确定）。

这是主题的演示。

侧边栏如何使用 CSS 以特定的窗口大小堆叠（让主要内容占据所有空间）？

我正在尝试设计一种方法来显示以跨浏览器兼容的方式响应调整大小的图像。使用 CSS3 媒体查询是行不通的，因为它们没有得到广泛支持。然而，jQuery 让我能够利用 HTML5 中的“数据”属性。

这就是我想出的。还有其他人有好主意吗？或者可以对这个想法进行任何调整？

Ok, So I designed a responsive layout that doesn't show images for very small screen sizes, using media queries and display: none;.

So far so good. But these images still download on these devices, causing an increase in bandwidth.

What is the proper way to make these images not download on the specified devices?

Any response would be much appreciated!

对于那些仍然不了解响应式设计的人，我建议使用此链接

只要它不理解媒体查询，例如：

我正在考虑使用adapter.js，你可以这样做：

它应该与960 网格一起使用但是你仍然可以在那些 .css 中使用任何你喜欢的东西

但问题是您需要启用 JavaScript。我希望你们中的任何人都知道更灵活（响应迅速！）的解决方案，有吗？

我正在为多种设备（台式机/平板电脑/移动设备）设计流畅的布局页面（在 CSS 中以 % 定义所有内容）

现在，虽然我确实知道给出 width:100% 会占用整个视口可用宽度（即可用浏览器区域）并相应地计算所有 % 宽度？

但我的问题是如何设置或将任何“像素”高度转换为 % 高度以定义流体布局 CSS？

我有一个网站，我想像这张图片一样布局：

红色是桌面版，黄色是移动版。我可以使用媒体查询轻松地在两者之间切换。

我的问题是如何为桌面版本编写 CSS - 我只包括移动版本，因为布局排除了桌面版本的一些布局技术。

每对中的内容（例如 A 和 B）可以有不同的高度，但它们足够相似，我想将它们布置为相同的高度，以便下一对标题对齐。

我猜最简单的方法是硬编码每对的高度，但如果可能的话，我宁愿避免这种情况。

我试图让我的网站在手持设备上调整大小，但由于某种原因它没有响应样式表。如果你看看这里：响应式设计链接并把 www.sofiamillares.com 作为站点测试，顶行被切断，一切看起来都超级大。

有人可以告诉我为什么要这样做以及解决它的最简单方法是什么？

我整理了一个简单的静态布局，我想了解如何将静态宽度转换为百分比，以便最终创建响应式 Web 布局。谁能推荐最简单的方法来计算布局宽度、字体大小、填充和边距的百分比？我已经习惯于以静态格式创建布局，但我希望完全了解如何实现这种 % 技术。

我的简单布局的链接在这里：http: //jsfiddle.net/9fH87/

欢迎所有建议，谢谢凯尔