【问题标题】:mobile device not detecting media stylesheet移动设备未检测到媒体样式表
【发布时间】:2013-09-28 02:52:55
【问题描述】:

我对响应式网站相当陌生,虽然我之前构建了一些运行良好的响应式网站,但由于某种原因,我在当前网站上遇到了问题。在笔记本电脑或台式机上查看时,调整浏览器大小时断点效果很好,但是在移动设备上查看时,它只会加载完整尺寸并使其适合屏幕宽度,而忽略媒体特定的样式表。正如我所说,我过去使用过这种方法并且没有遇到任何问题,所以希望有人能指出我正确的方向。我在论坛中看到过类似的问题,但对所提供的解决方案没有任何帮助。

我正在处理的 URL 是 www.evolvecollaboration.com/test/index.html,我的代码如下。

<meta name="viewport" content="width=device-width, maximum-scale=1.0, minimum-scale=1.0, initial-scale=1.0" />

<link rel="stylesheet" href="_css/myer_reset.css">

<link rel="stylesheet" type="text/css" href="_css/structure.css" />  

<link rel="stylesheet" type="text/css" media="only screen and (min-width:501px) and (max-width:800px)" href="_css/structure_tablet.css" />

<link rel="stylesheet" type="text/css" media="only screen and (min-width:50px) and (max-width:500px)" href="_css/structure_mobile.css" />

【问题讨论】:

  • 欢迎来到 SO,user2824486。

标签: html css


【解决方案1】:

试穿这些尺码。我将它们用于我的媒体查询。

电话: 只有屏幕和 (min-device-width : 320px) 和 (max-device-width : 480px)

平板电脑: 只有屏幕和 (min-device-width : 768px) 和 (max-device-width : 1024px)

视网膜: 只有屏幕和 (-webkit-min-device-pixel-ratio: 1.5)

【讨论】:

  • 感谢您的建议,我发现问题不在于代码本身,而在于服务器如何解释域掩码。
猜你喜欢
  • 2013-02-03
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2016-07-25
相关资源
最近更新 更多