問題があります.HTMLは小さな画面のCSSをロードしません. 他のcssを問題なくロードしました。動作するものには背景画像がありますが、幅が 500px 未満の小さな画面用のものにはありません。背景色のみになります。画像を 500px にスケーリングして small.css の背景画像として追加しようとしましたが、動作しますが、動作しません。助けてください。htmlコードは次のとおりです。
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, maximum-scale=1.0, minimum- scale=1.0, initial-scale=1.0" />
<title>PROCYCLING | MTB klub</title>
<link rel="stylesheet" type="text/css" href="mainstyle.css" />
<link rel="stylesheet" type="text/css" media="only screen and (min-width:801px) and (max-width:1024px)" href="large.css" />
<link rel="stylesheet" type="text/css" media="only screen and (min-width:501px) and (max-width:800px)" href="medium.css" />
<link rel="stylesheet" type="text/css" media="only screen and (min-width: 50px) and (max-width:500px)" href="small.css" />
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
</body>
背景画像なしの CSS は次のとおりです。
@charset "UTF-8";
/* Small Content Formatting */
body{
color:#6fe123;
line-height:1.5em;
font-family: Myriad Pro, Arial, Verdana;
font-size: 14px;
background-color: #2a2a2a;
}