如何在所有屏幕中增加 div 高度？答案

【问题标题】：how to increase div height in all screens?如何在所有屏幕中增加 div 高度？
【发布时间】：2020-11-08 15:33:46
【问题描述】：

在任何屏幕尺寸下，使用 data 和 body 和 div 边距增加红色框高度为 20px。 19201080 屏幕数据在红框内，但 1360768 屏幕数据不在红框内溢出。

background-color: red;
border: 10px solid yellow;
margin: 20px;
height: calc(100vh - 62px);

【问题讨论】：

可能是最小高度而不是高度

标签： css bootstrap-4 sass

【解决方案1】：

字母溢出div的原因是vh是当前显示高度的1%。如果高度设置为 100vh，则高度为当前查看屏幕的 100% 长度。示例 css 设置为 calc(100vh - 62px)，这意味着设置为当前查看的高度 - 62px。即使屏幕尺寸设置为 1920 * 1080，示例 css 的太多字母也会溢出。 overflowwed

为了在标签内制作字母，我希望标签与脚本一起应用。

<style>

    #test {

        background-color: red;

        border: 10px solid yellow;

        margin: 20px;

    }
</style>
<body>
    <div id="test">
        put text here
    </div>
<script>
    //Get id
    let div = document.getElementById('test')
    //It's the height of whole screen
    let height1 = document.body.clientHeight

    div.style.height = height1 + 'px'
</script>
<body/>

【讨论】：

vh：相对于视口高度的 1%*