最简单的媒体查询添加背景颜色不起作用？

Question

我觉得自己像个彻头彻尾的白痴...

这是最简单的事情，但它不适用于除 Firefox 之外的任何浏览器。

我在 html 的 head / style 部分声明它

任何帮助将不胜感激 - CES

body {
    background-color: yellow;
    font-size: 1vw;
}

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

    body{
        background-color: red;
    }

}

Answer 1

问题在于头部和缺少元标记......为了让您在 Chrome、Edge 和 Safari 中使用开发者工具设备空间断点，您必须包括：

meta name="viewport" content="width=device-width, initial-scale=1.0"

虽然在浏览器中查看页面时不包含它也能工作，但为了使用开发者工具，它必须位于头部。