Html 移动设备上的视口

我创建了一个网站，它有一个响应960px的外部包装，然后容器内的所有内容都用（不响应）固定

问题是当在手机上观看时，我会看到一个很大的站点，因为我有最小宽度为960px的容器

这是我需要修复或添加的视口问题吗

在这里拉小提琴：

HTML:

试试这个：

.wrapper{
    width: 100%;
    max-width: 1440px;
    background: grey;
}

.container{
    max-width: 560px;
    background: pink;
    margin: 0 auto;
}

因此，我从.wrapper中删除了最小宽度，为.container添加了最大宽度560px

希望这能解决你的问题

.wrapper{
    width:100%;
    max-width:1440px;
    min-width:960px;
    background:grey;
}

.container{
    width:560px;
    background:pink;
    margin:0 auto;
}

.wrapper{
    width: 100%;
    max-width: 1440px;
    background: grey;
}

.container{
    max-width: 560px;
    background: pink;
    margin: 0 auto;
}