相关疑难解决方法(0)

我目前正在尝试设计一个兼容多种屏幕尺寸的布局.我正在设计的屏幕尺寸如下:

屏幕尺寸:

1. 640×480
2. 800×600
3. 1024×768
4. 1280x1024(及更大)

我遇到的问题是创建css3媒体查询,以便当窗口的宽度达到其中一个宽度时,我的布局会发生变化.下面是我正在使用的媒体查询的示例,但它不适合我,所以我想知道是否有人可以帮我修复它.

<link rel="stylesheet" type="text/css" media="screen and (max-width: 700px)" href="css/devices/screen/layout-modify1.css">
<link rel="stylesheet" type="text/css" media="screen and (min-width: 701px) and (max-width: 900px)" href="css/devices/screen/layout-modify2.css">
<link rel="stylesheet" type="text/css" media="screen and (max-width: 901px)" href="css/devices/screen/layout-modify3.css">

我尝试使用一组新的媒体查询,但它们仍然不适合我.请有人帮忙解释一下我的错误.你们当中有几个人已经尝试过解释,但我没有得到它.新媒体查询显示如下:

<link rel="stylesheet" type="text/css" media="screen and (max-width: 640px)" href="css/devices/screen/layout-modify1.css">

    <link rel="stylesheet" type="text/css" media="screen and (max-width: 800px)" href="css/devices/screen/layout-modify2.css">

    <link rel="stylesheet" type="text/css" media="screen and (max-width: 1024px)" href="css/devices/screen/layout-modify3.css">

    <link rel="stylesheet" type="text/css" media="screen and (max-width: 1280px)" href="css/devices/screen/layout-modify4.css">