我已经尝试解决这个问题几个小时了，而且我把头发拉了出来，不管我做了什么，它都拒绝在媒体标签中调用CSS，即我添加最大宽度或最小宽度。为了测试，我使媒体标签使身体变红并将最小宽度减小到可笑的低。什么都没发生。如果我离开屏幕标签而没有其他内容，则称之为
CSS：
@import url("reset.css");
@charset "iso-8859-1";
@font-face {
font-family: cooper;
src: url('../resources/CooperBlackStd.otf');
}
@media screen and (min-width:500){
body{background-color:#FF0000;}
}
body {
line-height: 28px;
}
#pagecenter {
margin-left:5%;
margin-right:5%;
background: #d1d1d1; /* Old browsers */
background: -moz-linear-gradient(left, #d1d1d1 0%, #66a8d2 20%, #66a8d2 80%, #e5e5e5 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right top, color-stop(0%,#d1d1d1), color-stop(20%,#66a8d2), color-stop(80%,#66a8d2), color-stop(100%,#e5e5e5)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(left, #d1d1d1 0%,#66a8d2 20%,#66a8d2 80%,#e5e5e5 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(left, #d1d1d1 0%,#66a8d2 20%,#66a8d2 80%,#e5e5e5 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(left, #d1d1d1 0%,#66a8d2 20%,#66a8d2 80%,#e5e5e5 100%); /* IE10+ */
background: linear-gradient(to right, #d1d1d1 0%,#66a8d2 20%,#66a8d2 80%,#e5e5e5 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d1d1d1', endColorstr='#e5e5e5',GradientType=1 ); /* IE6-9 */
}
/*No one needs to select the navigation bar*/
nav {
width:100%;
float:left;
background-color:#0B61A4;
border-bottom:3px solid #000;
position:relative;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
nav > ul {
/*padding-left:10px;*/
display:block;
list-style:none;
position:relative;
float:left;
text-align:center;
margin-left:15em;
}
nav > ul li {
float:left;
}
nav ul li:hover{
background:rgb(63, 146, 210);
}
nav > ul li a {
position:relative;
height:100%;
padding: 2px 3px;
margin-bottom:3px;
margin:0;
display:block;
color:#000;
text-decoration:none;
}
nav ul:after {
content: "";
clear:both;
display:block;
}
nav ul ul {
display:none;
background:rgb(63, 146, 210);
position:absolute;
border-top:1px solid #000;
border-bottom:1px solid #000;
border-left:2px solid #000;
border-right:2px solid #000;
z-index:5;
}
nav ul ul li {
float:none;
border-top:1px solid #000;
border-bottom:1px solid #000;
height:50%;
position:relative;
}
nav ul ul li a {
color: #000;
padding:15px;
text-align:center;
position:relative;
font-family:cooper, times new roman, times, serif;
}
nav ul ul li a:hover {
background-color: rgb(102, 163, 210);
}
nav ul li:hover > ul {
display:block;
}
#logo {
border-left:3px solid #000;
border-right:3px solid #000;
margin-left:-3px;
padding:2px 3px;
height:inherit;
}
#logo img {
height:96px;
}
/*Navbar end*/
/*Butikk*/
table tr td {
vertical-align:top;
}
#shoplist {
width:100%;
float:left;
background-color:rgb(63, 146, 210);
border-bottom:2px solid #000;
}
#shoplist ul {
list-style:none;
margin:0 8%;
background-color:rgb(63, 146, 210);
text-align:center;
}
#shoplist li {
float:left;
}
#shoplist li a {
position:relative;
display:block;
padding:8px 25px;
text-decoration:none;
height:100%;
color:#000;
font-family:cooper, times new roman, times, serif;
border-right:2px solid #000;
}
#shoplist li:first-child a {
border-left:2px solid #000;
}
/* Universal */
.bigbutton {
position:relative;
list-style:none;
float:left;
background-color:rgb(209, 209, 209);
border:2px solid #000;
margin:5px 5px;
}
.bigbutton li {
float:left;
height:auto;
}
.bigbutton li a {
position:relative;
display:block;
padding:6px 6px 6px 25px;
text-decoration:none;
color:#000;
font-family:cooper, times new roman, times, serif;
}
.bigbutton li img {
height:32px;
padding:0px 15px 0px 8px;
}
HTML：
<!doctype html>
<html><!-- InstanceBegin template="/Templates/maintemplate.dwt" codeOutsideHTMLIsLocked="false" -->
<head>
<meta charset="iso-8859-1">
<!-- InstanceBeginEditable name="doctitle" -->
<title>Pedalsport</title>
<!-- InstanceEndEditable -->
<!-- InstanceBeginEditable name="head" -->
<style type="text/css">
body,td,th {
font-family: Arial, Helvetica, sans-serif;
}
</style>
<!-- InstanceEndEditable -->
<link href="css/main.css" rel="stylesheet" type="text/css">
<link rel="shortcut icon" href="img/favicon.ico">
</head>
<body>
<nav>
<ul>
<li><a href="butikk.html"><img src="img/Butikkicon.png" alt="Butikk"></a></li>
<li><a href="verksted.html"><img src="img/verkstedicon.png" alt="tekst"></a></li>
<li><a href="sykkelsti.html"><img src="img/mapicon.png"></a>
<ul>
<li><a href="sykkelsti.html">Svartvann</a></li>
<li><a href="sykkelsti2.html">Brønnøya</a></li>
<li><a href="sykkelsti3.html">Bogstad</a></li>
<li><a href="sykkelsti4.html">Brunkollen</a></li>
</ul>
</li>
<li id="logo"><a href="index.html"><img src="img/logo.png"></a></li>
<li><a href="Pedalbladet.html"><img src="img/magasinikon.png"></a></li>
<li><a href="Pedalklubben.html"><img src="img/klubbikon.png"></a></li>
<li><a href="omoss.html"><img src="img/abouticon.png"></a></li>
</ul>
</nav>
<!-- InstanceBeginEditable name="EditRegion1" -->
<div id="shoplist">
<ul>
<li><a href="#Barnesykler">Barnesykler</a></li>
<li><a href="#Temposykler">Temposykler</a></li>
<li><a href="#Landeveissykler">Landeveissykler</a></li>
<li><a href="#Terrengsykler">Terrengsykler</a></li>
<li><a href="#El-sykler">El-sykler</a></li>
</ul>
</div>
<div id="pagecenter">
<h1>Butikk</h1>
<ul class="bigbutton"><li><a href="Produktmagasin for web.pdf">Produktmagasin som PDF</a></li><li><img src="img/download.png"></li></ul>
<a name="Barnesykler">Barnesykler</a>
<table width="1061" border="0">
<tr>
<th scope="col">
Dynamite 20’’ Girl 2013</th>
<th scope="col"> </th>
</tr>
<tr>
<th width="256" height="156" scope="row">
<img src="img/Jentesykkel.jpg" width="227" height="138" align="left">
</th>
<td style="vertical-align:top;" width="795">
En pen og praktisk sykkel med fine farger. Perfekt for både landevei og terreng. Passer for jenter i alderen 8-12 år.
<br>
Pris: 1.699,-
</td>
</tr>
<tr>
<th scope="row">Fazer 16’’ Boy</th>
<td></td>
</tr>
<tr>
<th height="173" scope="row"><img src="img/Guttesykkel 16''.jpg" alt="Guttete sykkel" width="227" height="152" align="left"></th>
<td>En tøff og holdbar sykkel som passer til
de fleste anledninger med tøffe farger ogstøttehjul for de som trenger hjelp. Passer for gutter i alderen 6-10 år. <br>
Pris: 1.799,-
</td>
</tr>
<tr>
<th scope="row">Superior Team Issue 24 Deore</th>
<td></td>
</tr>
<tr>
<th scope="row"><img src="img/Guttesykkel2.jpg" alt="http://www.birksport.no/images/birksport%20images/Superior%20Team%2024%20Issue.jpg" width="222" height="123" align="left"></th>
<td>
En god sykkel med gode bruksmuligheter;
funker bra både på landeveien og i skog og mark.
For de som er kommet forbi nybegynner.
Passer for gutter og jenter i alderen 10-14 år. <br>
Pris: 3.599,-
</td>
</tr>
</table>
<br>
<hr>
<h1><a name="Temposykler">Temposykler</a></h1>
<table width="1063" border="0">
<tr>
<th width="249" scope="col">Norcom Straight 1.1 2014</th>
<th width="804" scope="col"> </th>
</tr>
<tr>
<th scope="row"><img src="img/Temposykkel.jpg" alt="Temposykkel" width="219" height="146" align="left"></th>
<td>En av markedes desidert sterkeste sykler,
en temposyklers drøm. Sykkelen er utstyr
med topnoch utstyr. Brukes av verdenseliten
som Matt Reed og Cameron Dye.
Pris: 49.999,-</td>
</tr>
</table>
<hr>
<h1><a name="Landeveissykler">Landeveissykler</a></h1>
<h1>Fuji Altamira SL</h1>
<img src="img/Landeveissykkel.jpg" alt="Landeveissykkel" width="201" height="121" align="left">
En flott landeveissykkel som har alt du er ute
etter. Denne sykkelen veier bare 6.2kg!
<br>
Pris: 34.999,-
<hr>
<h1><a name="Terrengsykler">Terrengsykler</a></h1>
<h1>Corratec Revolution carbon terrengsykkel</h1>
<img src="img/Terrengsykkel1.jpg" alt="Terrengsykkel" width="191" height="128" align="left">
Forskjellen mellom god og perfekt. Denne
sykkelen vil ta deg hvor du vil, når du vil
og hvor fort du vil. Ypperlig til både
konkurranse og for de som er ekstra dedikerte.<br>
Pris: 14.199,-
<h1> </h1>
<h1>Corractec X-Vert S.04</h1>
<img src="img/Terrengsykkel2.jpg" alt="Terrengsykkel2" width="188" height="118" align="left">
Perfekt sykkel, veldesignet for rundbane og
mosjon. Lever opp til alle dine behov, både
som mosjonist og som utdøver.
En sykkel vi sterkt anbefaler. <br>
Pris: 8.999,-
<hr>
<h1><a name="El-sykler">El-sykler</a></h1>
<h1>Superior Powerflex 24 Men</h1>
<img src="img/El-sykkel.jpg" alt="El-sykler" width="186" height="117" align="left">
Powerflex gir deg muligheten for et ekstra dytt
opp den litt tunge bakken. En meget
tilpasninsdyktig sykkel med 24V/ 250Watt
motor og Panasonic Li-Ion 25,2 V PCB batteri.<br>
Pris: 9.999,-
<br>
</div>
<!-- InstanceEndEditable -->
</body>
<!-- InstanceEnd --></html>
请原谅代码的绝对混乱，但在我对此问题失去理智之前，我没有时间清理它。
答案 0 :(得分：1)
您尚未指定像素值。尝试：
@media screen and (min-width:500px){
{body{background-color:#FF0000;}
}
答案 1 :(得分：1)
要扩展上一个答案，您没有指定任何单位，它不需要是像素。
您可以使用绝对长度'cm'，'mm'，'in'，'pt'，'pc'或'px'，字体相对长度'em'，'ex'，'ch'或'rem'或视口百分比长度：'vw'，'vh'，'vmin'或'vmax'。这只是长度，你可以在媒体查询中使用许多其他单位，包括像素密度，设备方向，设备类型等。