固定页面底部除了position：fixed 方法外还有其他方法吗？

除了使用 `position: fixed` 属性，还可以使用 flex 布局或者 grid 布局来实现将一个元素固定在页面底部。

使用 flex 布局时，可以将父元素的 `display` 属性设置为 `flex`，并将 `justify-content` 属性设置为 `space-between` 或者 `space-around`。然后将需要固定在底部的元素放在最后一个 flex 项，将其设置为 `align-self: flex-end`。这样就可以实现将该元素固定在页面底部。

示例代码如下：

<div class="parent">
  <div class="content"></div>
  <div class="fixed"></div>
</div>

.parent {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
}

.content {
  flex: 1;
}

.fixed {
  align-self: flex-end;
  height: 100px;
}

使用 grid 布局时，可以将父元素的 `display` 属性设置为 `grid`，并将其设置为只有一行，然后将需要固定在底部的元素放在最后一列，将其设置为 `align-self: end`。这样也可以实现将该元素固定在页面底部。

示例代码如下：

<div class="parent">
  <div class="content"></div>
  <div class="fixed"></div>
</div>

.parent {
  display: grid;
  grid-template-rows: 1fr auto;
  height: 100%;
}

.content {
  grid-row: 1 / span 1;
}

.fixed {
  grid-row: 2 / span 1;
  align-self: end;
  height: 100px;
}

以上两种方法都不需要使用 `position: fixed` 属性，可以让元素在不支持 `position: fixed` 的浏览器中也能正常工作。