Question

我试图制作一个包含以下内容的简单（响应式）网站：

头
背景图片
页脚

但是我无法在第一个屏幕上找到标题，背景图片和页脚的方法，而无需向下滚动页面。我已经在互联网和论坛上搜索过但我无法找到符合我需求的解决方案。

为了让网站响应我使用w3.css - ＆gt; http://www.w3schools.com/w3css/default.asp

这些是我使用http://www65.zippyshare.com/v/Hhb6FmUY/file.html

的文件

我希望我的问题很明确，有人可以帮助我！

Answer 1

我不从SO下载文件。

但我为您制作了一个非常基本的模板，其中包含一个页眉，背景和页脚，其中 NO 滚动。

HTML：

<head>
    <title></title>
</head>
<body>
<nav></nav>
    <footer></footer>
</body>
</html>

CSS：

html {
    position: relative;
    min-height: 100%;
}
nav{
  width: 100%;
  height: 50px;
  background: green;
}
body {
    margin: 0 0 100px;
  background: blue;
}
footer {
    position: absolute;
    left: 0;
    bottom: 0;
    height: 100px;
    width: 100%;
    background-color: red;
}

CODEPEN DEMO

如何让网站主页在屏幕上显示所有内容（无滚动条）？

1 个答案: