问题标签 [responsive-design]

我正在创建一个网站，我的所有产品图像都将根据浏览器窗口大小重新调整大小，因此我编写了一些媒体查询，其中我使用了一张大图像并以不同的窗口大小调整了它的大小，但我有一张我使用的图像背景，我如何重新调整它的大小？我希望在 IE7 和 8 中的所有浏览器中都支持它。

HTML

CSS

我的实时代码在这里：- http://jsfiddle.net/jamna/DdxbQ/19/这里我有一个主要的“产品图像”，现在根据浏览器窗口大小调整大小（在我的小提琴中，我没有为调整产品图像的大小，我现在只显示要调整的图像）但我有另一个“省钱标签”图像，它位于“跨度”的背景中，我想与产品图像同时调整大小。

我有什么办法可以修改 Sass 处理小数位的方式吗？看到有几个人说sass会动态做响应式布局需要的(target/parent)*100计算，并在编译时输出结果。它甚至还有一个百分比函数，它本质上将采用两个值并执行此操作。

唉，Sass 只会给我 3 位小数。到目前为止，我的理解是，在某些情况下，这可能不足以让所有浏览器正确显示布局而不会出现任何问题。

任何人都可以帮助我了解这一点吗？

编辑

解决了。万一其他人感兴趣，我设法在 Sass 的 number.rb 中完成了我想要的，改变了@precision 的值。这改变了所有浮点数的输出方式。

我正在研究响应式网页设计，并且遇到了许多这样做的方法，但是我正在努力区分这样做的最佳方法。

我 - 真的 - 喜欢这两个网站的工作方式：

1. http://paulrobertlloyd.com/
2. http://colly.com/

但是我似乎无法弄清楚它们是如何动态改变它们的布局的。是否有我遗漏的技术未在下面列出？

到目前为止，我遇到了以下方法：

1: Javascript

示例 - adapt.js

动态检测屏幕分辨率并选择适当的样式表。

2：CSS3媒体查询

使用如下技术：

3：后端

示例 -前置 PHP 文件

仅适用于站点的单个移动版本，镜像原始域并更改标题。

我有这个标记：

我正在尝试获得这种布局：

注意：previos 和 next 按钮靠近#player

我正在尝试这样：

问题是，如果分辨率太大或太小，它就不会像布局一样，

对于任何解决方案，我怎样才能实现这一目标？

今晚我正在尝试创建我的第一个响应式设计，但在调整页面大小时遇到​​了一些问题。除了大图标下方的数字和页面右下角的小图标外，一切似乎都正确响应。当它不是全尺寸时，两者似乎都从设计的其余部分“逃跑”，并且页面右下方的按钮暴露了应该隐藏的内容（按钮的悬停状态）。有想法该怎么解决这个吗？

该站点位于此处：[已删除，解决了我自己的问题]

我最近创建了我的网站的移动版本。一般来说，一切正常，但是我遇到了一些问题，即移动设备无法在代码片段上水平滚动以及 YouTube 视频嵌入。

1. 根据网站上的代码示例，我使用SyntaxHighlighter突出显示网站上的代码。这对桌面查看器非常有用，但是在移动设备上代码不能水平滚动（切断大部分重要代码）。

2. 我使用 YouTube 的 iframe 代码将视频嵌入到文章页面中，但是事实证明，让视频从桌面到移动设备正确地放大和缩小以填充内容容器（或达到最大尺寸）是很困难的。

任何对这些问题的帮助将不胜感激。

我在尝试减少 http 请求并使用 svg 而不是 css3 的东西的小实验中获得乐趣......无法将此 HTML SVG 设置为动态缩放。理想情况下，我想将它的宽度和高度设置为 50%，并让浏览器在窗口调整大小时完成其余的工作。

这是代码：

我正在使用响应式网页设计编写一个简单的网页，因此 CSS3 媒体查询可以根据屏幕分辨率提供不同的样式表。为简单起见，假设有一个 iphone 版本和一个桌面版本。我正在使用 html5 视频标签来提供视频，我想在使用桌面访问网站时提供 720p 视频，在使用 iphone 访问网站时提供更小的 320p 视频。我错了还是仅使用 html/css 就没有简单的方法可以做到这一点？我是否必须使用 javascript 来动态更改视频 src 属性？如果是这样，最佳做法是什么？提前致谢。

我正在写一个响应式的 wordpress 主题。我想为手机访问者提供不同的图像文件（更小），以节省带宽。有可能做这样的事情吗？

截至目前，移动访问者看到的是 css 调整大小的图像。谢谢你！

我制作了一个完全可扩展的简单网站……除了图像。正文和所有内容，div 设置为百分比，实际上我设计这种方式的目的是练习制作可以扩展到任何屏幕分辨率的网站。除了图像，一切都很顺利，而页面的其余部分随着浏览器的增加或缩小，图像要么溢出要么变小（在浏览器上放大和缩小时）。将图像宽度和高度设置为百分比不起作用，因为将浏览器水平或垂直拉伸得太远会导致图像变形。

注意：我宁愿不必隐藏溢出，如果我是正确的，那只会在图像变大时将其切断（如果我在这里错了，请纠正我）

并将高度/宽度设置为最大/最小似乎也不是一个理想的解决方案。

但是这个问题似乎是我不敢相信其他人没有遇到过的，所以我希望有人能帮我想出一个解决方案。请帮忙，拜托……这让我很紧张:(