我的问题的简单视频
我的媒体查询不会工作，所以我创建了最简单的测试来显示我的问题。但它的工作在这里与片段…但不是本地的VSC…为什么?我该怎么解决呢?
body{
background-color: aqua;
}
@media screen and (min-width: 480px) {
body {
background-color: lightgreen;
}
}<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>Document</title>
</head>
<body>
</body>
</html>当我在Chrome的设备工具栏中检查它时，代码似乎正常工作。在开发工具中尝试一下(f12)。Chrome文档:https://developer.chrome.com/docs/devtools/device-mode/
最新的浏览器不小于500px的宽度，当你试图使窗口变小。这就是为什么你在视频中看不到蓝色的原因。如果你仍然想尝试使用浏览器宽度，试着将480px改为600px。您将能够看到媒体查询工作。