如何从CSS获取浏览器的高度

Question

我在div标签中使用滚动条功能。

我想将滚动条设置为我的浏览器高度。

我试图获得这样的价值。

JavaScript

<script>
var height = window.innerHeight;
</script>

云服务器代码

    <style>
      .kryesore {
               overflow-y: scroll;
               overflow-y:auto;
               height:height-320px ;
            }
    </style>

在这里我创建了JSFIDDLE代码

我想在没有浏览器滚动条的情况下显示页眉和页脚中的表格。

滚动条应仅显示在我的要求表中。

如果我得到浏览器窗口高度，我会减去它 320。 然后它将解决我的问题，并且浏览器窗口滚动条也没有显示，因此我想将 JavaScript 值获取为 CSS。

任何人都可以告诉我正确的解决方案。

Answer 1

您只能通过CSS执行此操作。我不知道你的滚动条CSS类是什么，因此我正在使用scrollbar类。

<style>
  .scrollbar {
           overflow-y: auto;
           height: calc(100vh - 320px);
        }
</style>

100vh等于浏览器的高度，calc函数可以动态计算此类 CSS 值。

Answer 2

你不能通过CSS引用JS变量，但你可以用JS改变CSS。

尝试：

.JS

document.querySelector('.kryesore').style.height = height;