gpt4 book ai didi

html - 根据窗口大小和缩放调整 div 大小

转载 作者:行者123 更新时间:2023-11-28 08:59:16 24 4
gpt4 key购买 nike

我有一个需要动态调整大小的 div,但当我放大网页时我似乎无法让它工作。

<div style="background-color:red">
Result screen small
</div>
<div style="background-color:green;height:370px;overflow:scroll"> //ignore static height
stretch even when zoomed
</div>

http://jsfiddle.net/a6jscb6r/1/
http://jsfiddle.net/a6jscb6r/2/
我想将下方的 div(绿色的)完全保留在浏览器窗口内,认为绿色的 div 内的内容可以滚动

我能否动态调整它的大小以便在缩放时 div 会自行调整大小?

最佳答案

演示 - http://jsfiddle.net/victor_007/a6jscb6r/3/

将你的样式移到外面

使用 height:calc();

* {
margin: 0;
padding: 0;
}
html,
body {
height: 100%;
}
.head {
background-color: red;
height: 20px;
}
.cont {
background-color: green;
height: calc(100% - 20px);
overflow: scroll;
}
<div class="head">Result screen small</div>
<div class="cont">stretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even
when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch
even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when
zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch
even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when
zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomedstretch even when zoomed</div>

关于html - 根据窗口大小和缩放调整 div 大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26995973/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com