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

Question

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

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

我想获得像这样的值。

的JavaScript

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

CSS代码

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

here I have created JSFIDDLE code

我要显示页眉和页脚没有滚动条浏览器内的表。

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

如果我得到浏览器窗口的高度，我会减去它的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;