html - 最大宽度应该覆盖宽度，但不是

Question

我检查了多个站点上的文档，他们都同意 max-width应该覆盖 width在 CSS 中。但出于某种原因，它始终保持在 800 像素。这是我的 CSS:

.content{
  width: 800px;
  max-width: 100%;
}

这应该使它保持在 800 像素宽，除非窗口变小，然后缩小它，对吗？我也尝试了另一种方法:

.content{
  width: 100%;
  max-width: 800px;
}

这给了我相同的结果。无论如何，它总是 800px。我曾想过使用 min() ，但事实证明它已从 CSS 中删除(尽管我不知道为什么)。有谁知道我做错了什么？

我应该指出我已经包括了<meta name="viewport" content="width=device-width, initial-scale=1.0">在我的标题中。那没有效果。

Answer 1

你必须知道设备宽度可能大于 800px，如果 ti 大于 800px，那么你的 max-width:100% 将不起作用，除非其他一些比 800px 更宽的 dom 分散了包装器的注意力。