问题标签 [media-queries]

我试图仅在页面投影在墙上时（通过投影仪，当有人进行演示时）才将样式应用于页面。目前，我只能在全屏模式下在 Opera 中获得它。

有什么办法@media projection可以影响其他浏览器？另外，有没有办法让它只适用于投影，而不适用于投影的笔记本电脑？

如果没有，是否有任何可行的解决方法？我正在尝试在 css 中创建幻灯片，但也在演示者的笔记本电脑上提供带有额外控件的“演示者视图”。

非常感谢任何周边地区的任何帮助。

我正在尝试使用媒体查询来禁用特定浏览器宽度的浮动。此 if 语句仅在我重新加载当前大小的页面时才有效。当 CSS 属性更改时，是否可以让 jQuery 应用更改？

我可能应该在第二个 $('.two-column li') 上使用 $(this) 或其他东西，但我不知道为什么它不起作用。我对jQuery不太了解。

编辑：

默认情况下，两列 li 的样式类似于

然后让我们说...

这确实有效。当宽度低于 767px 时，它会停止浮动。我上面的丑陋 jquery 似乎部分工作。默认情况下，equalheights 插件会运行，但当宽度低于 767px 时，插件不会运行。我的问题是它是否运行取决于加载页面时浏览器的大小。我试图让它像响应式设计中的媒体查询一样动态。

我在准备好文件时调用它。

在更多研究和下面的评论的帮助下，现在就像这样，包括准备好的文档……虽然在调整大小时仍然没有这样做，需要刷新。

我有一个奇怪的问题，只有 IE9 才会出现。我正在处理具有桌面布局和移动布局的网页。相同的 HTML，不同的 CSS。问题发生在下面的代码中：

除 IE9 外，所有浏览器都会根据需要显示桌面站点。移动浏览器正确显示移动布局。IE9 的问题在于它还显示了移动布局。

现在，如果我从上面的代码中删除“only”和“screen”这两个词，IE9 就会正确显示桌面站点。问题是，移动浏览器也会显示桌面站点。我已经对此进行了一些研究，但还没有看到有关此问题的任何内容。

谢谢阅读，

约翰

我正在尝试“动员”我正在使用 CSS 中的媒体查询开发的网站。

我自己有一部安卓手机，所以一直在测试它，结果很好。

我现在想在 iPhone 上测试但没有设备，搜索了网络并下载了一些推荐的模拟器，似乎他们无法识别媒体查询，但没有设备可以测试；确定是否我的查询不起作用 - 或者它的模拟器无法识别它们。

有谁知道在 Windows 上运行并识别媒体查询的 iPhone / iPad 模拟器？

麦克风

我在我的项目中使用 css 媒体查询来创建一个适用于任何大小屏幕的网站。我希望像使用 css 一样触发不同的 jquery 函数。

例如，如果浏览器大小在 1000px 和 1300px 之间，我想调用以下函数：

但是当浏览器大小低于 1000px 时，js 会停止处理。等等等等。

我不确定这是否可行，但也许有一个现有的解决方案或插件可以根据浏览器窗口大小创建不同的 js 环境。我想我可以以某种格式创建条件语句。有什么想法吗？

我在我的 CSS 中使用以下媒体查询：

这在我的旧 iphone 3g 上看起来不错……但是当我将方向从纵向更改为横向时……它爆炸了……太大了，太宽了。

我试过这个：

没有帮助。

有什么建议么？

我宁愿不输入特定于景观的查询——如果可能的话，我想要一个通用的查询。

（是的，向下捏屏幕有点工作..但不是我正在寻找的用户体验。）

谢谢京东

使用时

在 iPhone Mobile Safari 上，当设备旋转时 CSS 会发生变化。

在 PhoneGap 框架 (0.9.5.1) 中使用此代码时，同一页面不会加载不同的 CSS。我们也遇到了问题

这可以修复，但仍然存在方向问题。任何提示如何解决此问题表示赞赏。提前致谢 - 亚历克斯

我在使用 Webkit 浏览器（Chrome/Safari）、CSS3 媒体查询display和float我的网站时遇到了问题。我网页上的默认样式是使元素nav向右浮动，并且display:inline-block. 当窗口大小调整为移动大小时，媒体查询将其重新设置为：float:none; display:block. 当浏览器恢复正常大小时，问题就出现了：导航元素似乎下降了大约其高度。这是一些图片和标记：

窗口正常和站点显示正确：

Window Mobile 大小，站点正确显示：

窗口大小恢复正常，站点显示不正确：

这是正常的样式nav（是的，我要把 IE7 的东西移到一个单独的样式表中......）

这是重新设置样式的媒体查询nav：

那么，这是一个 Webkit 错误，还是预期的行为？我做错了什么，还是Webkit？如果它是一个错误，有人知道任何好的解决方法吗？现场网站在这里，如果我需要提供更多信息，请告诉我。谢谢。

我正在组合一个工具，它允许人们使用 jQuery 在 HTML 页面上的任何位置双击并留下消息。它遇到了与消息定位有关的绊脚石。

我目前正在测试的代码：

这会在鼠标点击的位置创建一个新的“消息”。虽然这在一定程度上有效，但只要调整浏览器窗口的大小，“消息”就会移出位置。由于我最终希望保存消息（并检索它们），因此将它们加载到每个浏览器上的每个用户的不同位置并不理想。即使该页面使用媒体查询，我也希望将消息附加到页面布局。

我对这个问题的理解是，我需要将消息相对于用户单击的最近元素定位。问题是。我该怎么做？

任何提示或提示将不胜感激。

2011 年 4 月 7 日更新

我在下面得到的大多数答案并不是我真正想要的。我已将我的页面示例上传到 JSfiddle，以向您展示我的设置。这里的问题是使消息附加在相对位置，以便在调整浏览器窗口大小时消息会随着内容一起移动。

例如。如果我将消息附加到页面上的第二段，无论浏览器/设备宽度如何，我如何让该消息与该段保持一致。据我所知，我需要建立最近的块级元素（或具有 ID 或类的元素），可用于定位消息的相对位置。

希望能解决问题并感谢您的所有建议。

我目前正在开发一个网站的移动版本，该版本在 Firefox 和 Chrome 等默认浏览器中运行良好。Base 是一个流畅的布局，带有一个媒体查询，最大宽度为 440 像素（@media 屏幕和（最大宽度：440 像素）以定位纵向模式。

默认浏览器中的字体大小以及其他一些设置（例如较小的图像和 div 等）正在发生变化。但是，当我使用默认浏览器在 HTC Android 手机上测试该站点时，它仅显示最大宽度 440 样式而不是正常样式，即基于 480px 的宽度。

这种行为可能有什么问题？移动版可在 httpp://www.seeyouzoeningouda.nl/m 上找到

还没有发布 CSS，因为我真的不知道向您展示代码的哪一部分。css 基于默认的 HTMl5 样板模板 (www.html5boilerplate.com)