css - 任何屏幕尺寸的全宽和全高

Question

我知道这是一个非常简单的问题，但我是初学者。我正在寻找一个教程，它可以教我如何编写这样的设计：http: //dsp.io/。有人可以给我推荐一个吗？

我想知道如何让它占据整个浏览器的窗口，无论您查看网站的屏幕大小如何。

非常感谢您提前。

score 0 · Accepted Answer

在这里，您将获得有关如何制作响应式网站的教程：http: //www.netmagazine.com/tutorials/build-basic-responsive-site-css

基本上，您必须将<body> </body>标签中的所有内容包装到#wrapper 中，如下所示：

<div id="wrapper">

并在您的 css 文件中将宽度设置为 100%，如下所示

#wrapper {width:100%}

score 0 · Accepted Answer

这称为流体设计。

如果您是初学者，请尝试使用 Bootstrap。

检查此参考链接

如果您缩放浏览器，流体网格系统将更改为移动模板，如果您缩小填充整个屏幕，则会自动扩展。

Bootstrap 3 发布。看看那个！

希望这会有所帮助，如有任何疑问，请发表评论。

score 0 · Accepted Answer

您提到的网站没有“全宽和全高”，否则将无法滚动；这只是 100% 的宽度。

但是，如果您想要全宽和全高，您只需创建一个包装 div 并将这些属性设置为 100%：

#wrapper
{
    position: absolute;
    width: 100%;
    height: 100%;
}

然后从页面中删除不需要的边距和填充：

html, body
{
    margin: 0px;
    padding: 0px;
}

这是非常基本的东西，你应该在提问之前多学习和搜索。这是一个好的开始。

score 0 · Accepted Answer

这是Ethan Marcotte 的一本关于响应式设计的好书。您可以阅读它以了解如何制作响应式站点。

4 回答 4