CSS Footer

在每个页面的底部，页脚是网站中最被低估的区域之一。尽管如此，如果读者在主内容区域找不到他们想要的信息，页脚可以用来说服他们继续浏览您的网站。

CSS 页脚简介

当用户希望将组件固定在底部位置，以区分顶部元素的逻辑和底部元素的逻辑时，他们会在 CSS 中使用页脚。固定页脚和可移动页脚是两种不同的页脚形式。即使页面向上或向下滚动到顶部或侧面，页脚也始终固定在底部。这意味着页脚被永久地固定在底部。如今，几乎所有网站都具有固定页脚功能，因为滚动整个页面会使得从页脚选择多个选项变得非常困难。如果我们要访问页脚项，我们必须返回到顶部。由于这会使用户等待更长时间，因此开发人员为 Bootstrap 创建了粘性页脚的概念。因此，大多数用户更喜欢固定页脚而不是可移动页脚，因为后者总是会随着页面滚动。

优点

1. 固定页脚可以方便地访问底部各项。
2. 页脚将逻辑与页眉部分分开。

为什么选择 CSS 而不是 HTML？

HTML 中的开发人员必须为每个类、id、链接、按钮等创建不同的样式。相比之下，CSS 允许我们在一个文件中创建通用逻辑，该文件可以通过 `` 标签包含在 HTML 文件中，即使有成千上万个 HTML 页面。

注意：应注意 CSS 文件以 .css 后缀存储。

CSS 页脚如何工作？

CSS 中的页脚只是一个类似于底部导航栏的结构；我们可以使其成为粘性或可移动的，然后应用下面的语法。

固定页脚语法

可移动页脚语法

CSS 页脚示例

这里有几个不同的例子

示例 1：可移动页脚

输出

说明：在上面的示例中，只需上下滚动即可看到页脚移动。

示例 2：可移动页脚

输出

说明：在上面的示例中，无论我们向上或向下滚动，页脚都保持可见。

结论

固定页脚和可移动页脚是使用 CSS 创建页脚的两种方法。首先，页脚将页眉的逻辑与页脚的逻辑分开，并使用固定页脚快速访问底部部分。