问题标签 [media-queries]

我的测试得到了一些奇怪的结果。我正在使用双显示器设置，在“主”显示器上测试媒体查询时，一切正常，缩放浏览器窗口等。但是当我将浏览器移动到辅助显示器时，我得到了方向横向并且设计切换到“平板模式”。

视窗 7 64

铬：

在辅助监视器上获取方向

FF5：

在辅助监视器上获取方向

歌剧 11.5：

在所有显示器上获取方向

IE9：

按预期工作

示例代码：

HTML 示例：

当我组织我的 CSS 时，我喜欢完全保留相关的样式（页眉样式在一个部分，页脚样式都在同一个地方，等等）（对不起，OOCSS 倡导者）。

我最近一直在尝试针对更小/更大屏幕的媒体查询。为了与我的组织方案保持一致，我必须在代码的每个部分中包含针对每个屏幕尺寸的单独查询。（例如，如果我支持七种不同的屏幕尺寸，我的“标题”CSS 将有七个不同的媒体查询，然后在“页脚”部分有七个查询等）

撇开这是否是我应该这样做的问题不谈，拥有如此多的媒体查询块是否有任何技术后果？（它们都是min-width,max-width或两者都有。假设我有 100 个不同的查询，但是我一遍又一遍地检查只有七种不同的大小。）浏览器会花费更长的时间来解析吗？

我知道我可能无法在 CSS 文件中执行 jQuery。但这是我的难题：

我有几个带有叠加层的 div。在桌面上，用户将鼠标悬停在覆盖层上，它会向上滑动显示内容。

在移动设备上，没有悬停状态（优雅地实现）。我如何使用我现有的媒体查询逻辑来禁用这些特定 div 上的 jQuery 悬停？

欢迎任何建议，甚至是解决此问题的替代方法？

我正在构建网站的移动版本（不是 mobile.domain.com），但只是根据设备提供不同的样式表。

所以我有这样的事情：

我的移动样式表显然只隐藏/显示移动站点上我想要的内容，然后覆盖style.css.

我遇到的问题是我似乎无法找到我没有覆盖的样式。意思是，如果我完全删除 style.css- 该网站看起来很完美。如果我留在那里 style.css，它看起来并不那么完美。

有没有办法让我在页面加载时动态删除 style.css？

或者我会以完全错误的方式解决这个问题。

我想做什么我认为不可能，但我还是问了=>

首先 - 我在打印时不显示图像，因为我的页面可能会导致图像变重，或者至少有几个尺寸合适的图像会消耗墨水。那么是否可以不显示图像但显示图像的 ALT 文本，以便用户知道图像是什么。

其次 - 当用户打印表单时，表单的样式有点难看。有没有办法更改输入以仅显示输入的文本而不显示其他内容。

有一个类似的问题 ~打印样式表 - 将输入转换为文本~ 我知道这可以使用 jQuery 来完成，但是是否有 CSS Only 方法来实现这一点？

谢谢！

编辑- 我想出了我的第二个问题。我将表单边框和背景设为白色以匹配页面。换句话说，它隐藏并仅显示文本。=>

max-device-width我需要为 iphone/android 手机开发一些 html 页面，但是和有什么区别max-width？我需要为不同的屏幕尺寸使用不同的 css。

有什么不同？

我正在使用以下 CSS @media 查询为 iPhone 和 Android 等移动浏览器设置页面样式：

但是，我的一位用户说它没有检测到他的 Droid 2 手机。他的用户代理字符串是：

那是怎么回事？

我目前正在构建网站的移动版本。

不是一个单独的域（mobile.example.com），而是一种响应式方法（使用媒体查询加载某些 CSS 以适应屏幕大小）

但是，我似乎无法弄清楚如何减少“页面大小”。

我的站点的桌面版本包括一个 jquery 滑块插件，它可以在五个相对较大的高分辨率图像中滑动。我的移动端不包括那个。但是，这些图像会在构建移动版本时继续加载。

我已将它们的显示属性设置为无，但这仍然会加载图像。

那么，无论是通过 javascript 还是其他类型的媒体查询，我怎样才能指定应该加载哪些文件，不应该加载哪些文件呢？

如何在 Chrome 开发者工具中调试 css 的方向：纵向？

我在里面写的任何东西 (orientation:portrait)都无法通过 Firebug 和 Chrome 开发工具即时编辑。它总是显示正常的属性。

当我们制作特定于 iPad 的网站（我正在为桌面用户制作不同的网站）并且我们还想为纵向和横向模式编写不同的 CSS 时，您更喜欢哪种方法？

第一种方法

我们可以只使用一个 http 请求来保留单个 CSS 文件

并在内部使用媒体查询来保持代码分离

第二种方法

我们可以使用 2 个 CSS 文件和 2 个 http 请求

您更喜欢哪种方法，如果您有任何改进建议，请告诉。

注意：我正在为平板电脑制作单独的网站，它不适用于桌面和移动设备

编辑 2： *在第一种方法中，最好也指定 Landscape，否则没有必要。*

将此与第一个方法代码进行比较

style="text/css"可以从 CSS 链接中删除吗？

我应该保持media="all"链接还是没有必要？