css如何设置高度为屏幕高度

在设计网页时，有时需要将元素的高度设置为屏幕高度来实现全屏效果或者一屏滚动的效果。下面将介绍如何使用CSS来设置高度为屏幕高度。

首先，在CSS中，可以使用“vh”单位来表示屏幕高度的百分比。1vh等于屏幕高度的1%。因此，可以将元素的高度设置为100vh，来让其与屏幕等高。

.element {
  height: 100vh;
}

需要注意的是，浏览器可能为页面添加一些默认的边距和内边距，这会影响元素高度的计算。可以使用CSS重置来去掉这些默认样式。

* {
  margin: 0;
  padding: 0;
}

此外，还可以使用JavaScript来实现动态设置元素高度为屏幕高度：

document.querySelector('.element').style.height = window.innerHeight + 'px';
window.addEventListener('resize',function() {
  document.querySelector('.element').style.height = window.innerHeight + 'px';
});

上述代码会在页面载入时将元素高度设置为屏幕高度，并在窗口大小变化时重新计算并更新元素高度。

综上所述，可以通过在CSS中使用“vh”单位或JavaScript设置元素高度来实现元素等高于屏幕的效果。