0

这一定是非常简单的事情,而且它正在工作。我正在使用 css3 媒体调用来构建响应式网站,但我一生都无法理解为什么以下内容不再起作用。

这里的页面代码:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Untitled Document</title>

<link href="assets/css/layout.css" rel="stylesheet" type="text/css">
</head>

<body>
</body>
</html>

和 layout.css:

body {
background-color:#FFF;
}

@media screen and max-width 980px {
body {
background-color:aqua;
}
}

@media screen and max-width 700px {
body {
background-color:#ff4500;
}
}

@media screen and max-width 480px {
body {
background-color:#ffd700;
}
}

那有什么问题?

谢谢。

4

2 回答 2

2

我注意到您的媒体查询中有几个格式问题;尝试改用这种格式:

@media screen and (max-width: 700px) {

    ...

} 
于 2013-02-15T15:28:15.807 回答
0

在body标签中放一些东西。因为它是空的,所以没有显示。

于 2013-02-15T15:16:12.147 回答