css 底部固定(css如何设置底部固定)

CSS 是我们网页设计中最重要的工具之一，其中之一的技巧是让网页的底部固定。在本文中，我们将学习如何使用 CSS 实现这一功能。首先，我们需要向 HTML 中添加一些标记。

// HTML 代码 

如上所示，我们将网页的主要内容包含在一个带有“wrapper”类的 DIV 容器中，底部内容则包含在一个带有“footer”类的 DIV 容器中。现在，我们必须使用 CSS 将这两个容器固定在底部。

// CSS 代码 
body {
position: relative;
height: 100%; 
}
.wrapper {
min-height: 100%;
margin-bottom: -100px; 
}
.footer {
height: 100px; 
}

如上所示，我们将 HTML 的整个文档设置为“position: relative; height: 100%;”，以便可在浏览器中完全显示。接下来，我们将 wrapper 容器的“min-height”设置为“100%”，并将“margin-bottom”设置为“-100px”，以便将 footer 容器推到底部。最后，我们将 footer 容器的高度设置为“100px”，以便显示底部内容。

在这里，我们已经学会了如何使用 CSS 将底部固定。当然，这只是其中的一种方式。如果您有其他更好的方法，请在下方留言，与我们分享。