Html 如何使用背景图像调整DIV的大小？_Html_Background Image

Html 如何使用背景图像调整DIV的大小？

html

Html 如何使用背景图像调整DIV的大小？,html,background-image,Html,Background Image,对于CSS3来说，这是一个非常新的问题，当背景图像变大（高度）时，DIV没有改变高度。DIV应该随着背景图像的扩展而扩展。此DIV之后将有一个固定高度的页脚网页： html，正文{ 身高：100%；宽度：100%；填充：0；保证金：0； } #全屏背景图像{ 背景图片：url（../img/kalustekeskus_bg.jpg）；背景尺寸：封面；背景重复：无重复；最小宽度：1024px；宽度：100%；最小高度：90%；位置：固定；溢出：隐藏；边框：1px纯红； }

对于CSS3来说，这是一个非常新的问题，当背景图像变大（高度）时，DIV没有改变高度。DIV应该随着背景图像的扩展而扩展。此DIV之后将有一个固定高度的页脚

网页：

html，正文{
身高：100%；
宽度：100%；
填充：0；
保证金：0；
}
#全屏背景图像{
背景图片：url（../img/kalustekeskus_bg.jpg）；
背景尺寸：封面；
背景重复：无重复；
最小宽度：1024px；
宽度：100%；
最小高度：90%；
位置：固定；
溢出：隐藏；
边框：1px纯红；
}
卡卢斯特克库斯

有什么聪明的方法可以做到这一点吗

谢谢

您在网站中使用的最小重量：600px；将此更改为最小高度：90%

您可以指定最小高度的百分比，然后div将根据您在图像中执行的操作展开。

在哪个浏览器中测试。看起来它在chrome.DIV中运行良好，在Firefox（Mac和Windows的最新版本）中高度不变。DIV容器的高度应随背景图像的变化而变化。请在此处发布您的代码。在我的第一篇文章中发布的代码，谢谢。谢谢，尽管我调整浏览器的大小（加宽），但DIV不会随背景图像展开，图像将在DIV中被裁剪。

html, body {
    height: 100%;
    width: 100%;
    padding: 0;
    margin: 0;
}

#full-screen-background-image {
    background-image: url(../img/kalustekeskus_bg.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    min-width: 1024px;
    width: 100%;
    min-height: 90%;
    position: fixed;
    overflow: hidden;
    border: 1px solid red;
}

<!DOCTYPE html>
<html>
<head>
<title>Kalustekeskus</title>
<link href="css/style.css" rel="stylesheet" type="text/css">
</head>

<body>
    <div id="full-screen-background-image"></div>
</body>
</html>