為什么@media only screen and (min-width: 768px) 也適用於屏幕寬度小於768px

Question

最小寬度 768 的 css 在移動設備上無法正常工作。 但是相同的 css 在 chrome 桌面瀏覽器中寬度小於 768 的 inpect 模式下工作正常。

@media only screen and (min-width: 768px){
#main {
    max-width: 75%;
    float: left;
}
}

但是當我在檢查工具中切換到移動模式時，它又無法正常工作。

我正在嘗試編輯博客經典主題。 博客鏈接https://egadgetdeals.blogspot.com/2019/11/what-youll-build-in-part-1.html?m=1

Answer 1

缺少用於避免縮放的元標記視口，將其添加到 head 標記中：

<meta name="viewport" content="width=device-width, initial-scale=1">