Question

我有一个网站，为了适应某些网页的内容，网站的最小宽度为1170像素。我也不能单独制作移动版本。

IPhones和Droids通常会自动调整页面大小以适应宽度。但是，如果内容的高度小于屏幕的高度，然后宽度在屏幕外运行，它们似乎不会调整页面大小。

我应该改变什么想法？我不知道要做什么编辑不会弄乱桌面演示文稿。

Answer 1

有一些方法可以做到这一点非常重要

如果你想要在设备上工作，只需将代码放在</head>

的结束标记之前

<meta name="viewport" content="width=device-width" />

然后，如果您不想重复您的代码，只需使用media queries

定位您希望网站显示的屏幕

以下示例：

@media handheld, screen and (max-width: 320px){
    .yourElementClassOrId {
        width:100%;  
    }
} 

@media handheld, screen and (max-width: 720px){
    .yourElementClassOrId {
        width:100%;  
    }
}  
@media handheld, screen and (max-width: 620px){
    .yourElementClassOrId {
        width:100%;  
    }
}

但如果您的网站已有flexible grid

，则很容易操纵您的网站

希望这个帮助

Answer 2

尝试将target-densitydpi=device-dpi添加到元视口。这是Android特定的。

<meta name="viewport" content="width=device-width, target-densitydpi=device-dpi">

Answer 3

您使用的是Twitter bootstrap，代码中缺少 bootstrap-responsive.css 。

将宽网页安装到移动设备的宽度

3 个答案: