智能手机的额外空间

Question

我的网站主题是Drupal响应主题（Pixture重新加载），宽度设置为960px，最大宽度为1140px，宽度为90％。

在PC上，该网站对所有浏览器都很好。在SP，左边有额外的空间。我不知道如何检查原因并修复它。请帮我理解出了什么问题。感谢。

Answer 1

您必须在随模板提供的css文件中编辑media-queries。要为max-width:960px;的屏幕添加额外的20px填充到主体，我建议在代码中添加以下内容：

@media only screen and (max-width: 960px) {
   body {
     padding-left:20px;
     padding-right:20px;
   }
}

您当然可以通过更改第一行来修改该样式表，例如：要为宽度在500到960px之间的屏幕制作40px填充，你会写：

@media only screen and (min-width:500px) and (max-width: 960px)

如果您不想使用媒体查询，只需添加以下内容即可直接将填充应用于正文：

body {
    padding-left:20px;
    padding-right:20px;
}

这将为每个屏幕添加填充（甚至超过960px），但最终结果将是相同的。

所以，选择你觉得更舒服的选项。第一个给你更多的灵活性，但它更复杂。第二个更简单，更容易实现。