Question

我正在尝试为移动设备构建一个单独的CSS文件。常规站点最初并非基于移动设备构建，但该站点现在需要移动功能。问题是，我无法在任何手机设备上加载移动css文件。我在两个单独的浏览器中尝试过我的Droid Razor，我也尝试使用它来模拟它：http://www.mobilephoneemulator.com/。

我无法以任何方式加载移动CSS文件。我不知道为什么。我设置了一些div和所有图像来显示：none;只是为了看它是否有效，但我没有得到任何结果。任何帮助将不胜感激。

以下是我对css文件的链接。

<link href="/stylesheets/css_Sanford.css" rel="stylesheet" type="text/css" media="only screen and (min-device-width: 481px" />
<link rel="stylesheet" type="text/css" href="/stylesheets/content-sanford.css" media="only screen and (min-device-width: 481px" />
<link rel="stylesheet" href="/stylesheets/mobile-sanford.css" media="only screen and (max-device-width: 480px)" />

这是移动CSS文件代码：

@charset "utf-8";
/* CSS Document */

#sliderFrame{
display:none;   
}

#slider{
display:none;   
}

img {
dipslay:none;   
}

div#player{
display:none;   
}

Answer 1

你在两个第一个链接

中忘记了一些“）”

<link rel="stylesheet" type="text/css" href="/stylesheets/css_Sanford.css" media="only screen and (min-device-width: 481px)" />

<link rel="stylesheet" type="text/css" href="/stylesheets/content-sanford.css" media="only screen and (min-device-width: 481px)" />

<link rel="stylesheet" type="text/css" href="/stylesheets/mobile-sanford.css" media="only screen and (max-device-width: 480px)" />

移动CSS无法加载。我的代码是否正确？

1 个答案: