使用 CSS 创建响应式网页（需要有关页面宽度的帮助）答案

【问题标题】：Create responsive web page with CSS (need help about page width)使用 CSS 创建响应式网页（需要有关页面宽度的帮助）
【发布时间】：2015-08-25 15:20:09
【问题描述】：

我正在尝试为四种尺寸的屏幕（320 像素、640 像素、980 像素和 1024 像素）创建响应式网页。因此，当我使用网站大小时，一切看起来都很好，都响应良好，但是当我将大小设置为大于 1024 像素时，我想停止任何调整大小的操作，并使页面看起来像大小为 1024 像素时的样子。我试图在互联网上找到解决方案，但我没有。那么有人可以帮助我吗？谢谢！

附：我找到了有关使用 max-width 属性的信息，但它没有帮助。我使用vw 单位来定义尺寸。

【问题讨论】：

你能把你试过的代码贴出来吗？
您可以尝试添加另一个媒体查询并使用 min-width:1024px
我在这里使用最小宽度：1024px；最后可以将最大末端宽度 Css 复制到其中 - jsfiddle.net/b1ysh92s

标签： html css responsive-design viewport

【解决方案1】：

当宽度大于 1024 时，您必须为页面使用特定的 px 宽度。比如你有一个.container {width:100%;}小于1024的大小，你可以添加：

    @media screen and (min-width: 1024px) {
.container {
    width:1000px;
}}

当屏幕大于 1024px 时，您的 .container 仍然宽度为 1000px。

【讨论】：

【解决方案2】：

您可以使用视口元标记来控制您的布局。

这篇文章会对你有所帮助。

https://developers.google.com/speed/docs/insights/ConfigureViewport

【讨论】：