css设置高度为100%，而且不随页面大小改变

CSS中的`height: 100%`通常用于让元素的高度与其父元素的高度保持一致，当希望元素充满其容器时非常有用。但是，直接设置`height: 100%`有时不会完全占据整个屏幕，特别是当父元素不是视口（viewport）或者没有明确的高度值时。

如果你想要一个元素始终保持全屏高度，并且不受滚动的影响，可以采用以下方法：

1. **HTML结构**：
确保你的元素有一个包含它的固定高度的祖先元素，例如`html`和`body`标签，或者一个拥有`min-height: 100vh;`（视口高度单位`vh`) 的外层容器。

<div class="full-screen-container">
  <!-- 你的内容 -->
</div>

2. **CSS样式**：
给这个`full-screen-container`应用`height: 100%; overflow: auto;`，这会让它填充其可用空间，并允许内部内容滚动。

.full-screen-container {
  height: 100%;
  min-height: 100vh;
  overflow: auto; /* 如果内容超过容器高度 */
}

这样，无论浏览器窗口大小如何变化，该元素都会填满整个可视区域。