网页底部页脚实现方法 - 不使用fixed属性 - 常规

网页底部页脚实现方法 - 不使用fixed属性

本文介绍如何利用HTML和CSS创建一个始终显示在网页底部的页脚，无需使用fixed属性，即使网页body的高度为1000px也能正常显示。

可以使用以下代码来实现一个显示在网页底部的页脚：

HTML代码：

<footer>
  <p>甄达海 2100770036 软工2106  版权所有 © 2023 个人主页</p>
</footer>

CSS代码：

footer {
  position: relative;
  margin-top: 900px; /* 1000px - 100px */
  height: 100px;
  background-color: #f0f0f0;
  text-align: center;
  padding: 20px;
}

这段代码将创建一个<footer>元素，设置其相对定位，上边距为900px（即网页高度减去页脚高度），高度为100px，并设置了背景色、居中对齐和内边距。

将以上HTML和CSS代码放在网页的<body>标签结束前的位置，即可在网页底部显示一个固定的页脚。