css - 按浏览器高度调整 div

Question

如何使 div 成为浏览器的高度 - 40px？

如果这很容易，我怎样才能使 div 成为（浏览器的高度）-（元素在页面上开始的距离）-（40px）？

只有 CSS 是理想的。在 javascript 中执行此操作很容易，但我们都知道这是不好的形式 :)

Answer 1

您可以在底部使用填充：

selector {
   position:absolute;
   ....
   height:100%;
   padding-bottom:40px;
}

Answer 2

div {
    height: calc(100% - 40px);
}

我认为没有任何方法可以在没有 JS 的情况下获取“元素从页面开始的位置”信息。

Answer 3

将 div 设为浏览器窗口的 100% 高度

body,html{
  height:100%;
}

div#right{
  height:100%
}

而且你可以添加一些填充。