html - 如果内容超过高度，如何使 div 高度自动适应屏幕并展开

Question

在我的网页上，我有一个扩展(高度)以适合屏幕大小的 div。

这是我的 CSS:

.round-cornerapp {
      -webkit-border-radius: 5px 5px 5px 5px; 
      -moz-border-radius: 5px 5px 5px 5px;
      -o-border-radius: 5px 5px 5px 5px;
      border-radius: 5px 5px 5px 5px;
     background-color: #C2C2BD;
     height:100vh;
     padding-top: .5cm;

   }

如果内容超出屏幕尺寸，我希望 div 自动调整。

我尝试了以下方法:

.round-cornerapp {
      -webkit-border-radius: 5px 5px 5px 5px; 
      -moz-border-radius: 5px 5px 5px 5px;
      -o-border-radius: 5px 5px 5px 5px;
      border-radius: 5px 5px 5px 5px;
     background-color: #C2C2BD;
     height:100vh;
     height:auto;
     padding-top: .5cm;

   }

高度不会随着上面的内容自动扩展，除非我删除高度:100vh，此时高度不再适合屏幕，具体取决于 div 的内容。

如何使 Div 适合我的屏幕大小，即使它是空的，并在添加 div 时自动扩展高度

Answer 1

更具体地使用 jQuery，$(document).height() 函数。

$('.divFullScreen').height($(document).height());

否则，您也可以按如下方式使用 CSS。

.divFullScreen {
    min-height: 100vh;
}

PS:您的 div 的类应该是 divFullScreen 才能正常工作。