[分享]css全屏但不随窗口大小变化

CSS实现全屏效果是一个很常见的需求，但是有些情况下我们需要全屏的同时保持元素不随窗口大小变化，这时就需要使用一些特殊的CSS技巧来实现。首先，我们来看一下如何实现全屏效果：html, body { ...

CSS实现全屏效果是一个很常见的需求，但是有些情况下我们需要全屏的同时保持元素不随窗口大小变化，这时就需要使用一些特殊的CSS技巧来实现。

首先，我们来看一下如何实现全屏效果：

html, body {
  height: 100%;
}

.element {
  height: 100%;
} 

在这个例子中，我们将HTML和Body的高度都设置为100%，然后将需要全屏的元素的高度也设置为100%，这样就可以实现全屏的效果。

但是，如果我们希望元素不随窗口大小变化，就需要用到一些特殊的技巧：

.element {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
} 

在这个例子中，我们将元素的位置设置为绝对定位，然后将左上角的位置都设置为0，这样元素就可以覆盖整个窗口。同时，我们使用了vw和vh单位来设置元素的宽度和高度，这代表视口的宽度和高度，而不是像素值，这样就可以保证元素不随窗口大小变化了。

以上是使用CSS实现全屏但不随窗口大小变化的基本技巧，具体的实现还需要根据具体的需求进行调整。