高度屏幕，但固定

我试图做一个固定的位置DIV粘在页面的底部，具有起始高度，屏幕（like vh）的70%。我将使其可调整大小与jQuery可调整大小。高度屏幕，但固定

问题是，如果我应用height: 70vh或height: 70%，当用户调整浏览器高度时，div会调整大小，并且我想保持它不变。不知道该怎么办？

div { 
 
    position: fixed; 
 
    display: block; 
 
    bottom: 0; 
 
    width: 500px; 
 
    height: 70vh; 
 
    background-color: red; 
 
}

<div> 
 
</div>

查看全部网页的摘要。

来源

2017-09-27 Adi Pîslaru

那么你的意思是，DIV是没有得到调整？因为当我调整我的浏览器时，它正在调整大小。你能否详细说明预期的内容？ – nabanita

我们只能做到这一点的'js'或'jQuery'或者如果你愿意，你可以设置'最小height'固定'px'值。 – weBBer

@nabanita我希望它不会调整大小。 –

1. vh或%将相对于viewport或屏幕高度的高度。所以我们需要在dom负载中用javascript设置div的初始高度。

Next（调整大小部分）可以用CSS resize属性完成。 ** PS：在div的右下角你可以看到调整大小图标并进行大小调整。

document.getElementById("demo").style.height = window.innerHeight*.7+"px";

div { 
 
    position: fixed; 
 
    bottom: 0px; 
 
    width: 500px; 
 
    background-color: red; 
 
    resize:vertical; 
 
    overflow:auto; 
 
}

<div id="demo"></div>

来源

2017-09-27 13:14:07 nabanita

可以最小高度添加到DIV，以便它不会调整自身超越特定的高度。

喜欢这张

div { 
 
    position: fixed; 
 
    display: block; 
 
    bottom: 0; 
 
    width: 500px; 
 
    height: 70vh; 
 
    min-height: 500px; 
 
    background-color: red; 
 
}

<div> 
 
</div>

来源

2017-09-27 12:17:31

高度屏幕，但固定

回答

相关问题