将css背景定位在窗口底部,无需额外标记或最小高度

将css背景定位在窗口底部,无需额外标记或最小高度,css,background,positioning,Css,Background,Positioning,是否可以在没有额外元素或最小高度的情况下将背景图像放置在窗口底部 无论网页有多短,我都试图在窗口底部有一个图像,而不是身体 我的意思是,如果页面长度超过垂直屏幕分辨率,浏览器允许您滚动到底部,图像将位于底部(页脚背景) 如果页面很短,可能是屏幕高度的一半,页脚背景将“悬挂”在半空中。我试着把它放在窗户的底部 我尝试了min height,但这要求您设置足够大的高度,以覆盖访问您的站点的用户可能会创建的最大分辨率,如果您缩小浏览器的大小(或者如果用户的屏幕较小),这些区域仍然存在 我尝试将页脚背景

是否可以在没有额外元素或最小高度的情况下将背景图像放置在窗口底部

无论网页有多短,我都试图在窗口底部有一个图像,而不是身体

我的意思是,如果页面长度超过垂直屏幕分辨率,浏览器允许您滚动到底部,图像将位于底部(页脚背景)

如果页面很短,可能是屏幕高度的一半,页脚背景将“悬挂”在半空中。我试着把它放在窗户的底部

我尝试了min height,但这要求您设置足够大的高度,以覆盖访问您的站点的用户可能会创建的最大分辨率,如果您缩小浏览器的大小(或者如果用户的屏幕较小),这些区域仍然存在

我尝试将页脚背景设置到body元素上,但它挂起了。将页脚背景设置到html元素只会在底部给我一个白色区域,因此我将其用作页眉背景

我的网站的基本布局是:

<html>
<body>
<div id="header">other elements and header stuff</div>
<div id="main">main content</div>
<div id="footer">other elements and footer stuff</div>
</body>
</html>

其他元素和标题
主要内容
其他元素和页脚内容
你的意思是粘脚

    • 我愿意这样做

      html {
         min-height: 100%;   
      }
      
      body {
         background: url(path/to/image.png) no-repeat center bottom;   
      }
      

      .

      不,我想他指的是位于视图端口底部的
      背景图像
      。在他的HTML中,他编写了
      其他元素和页脚内容
      ,因此我想他不只是希望页脚中有图像。不过,问题标题本身似乎支持我的解释。当然,我可能会大错特错。事实上,这是完美的。我试过一次,由于某种原因,它不起作用,所以我研究了css sticky footer,但这意味着我必须用包装器包装我的页眉和main,并且需要一个固定高度的页脚。我回去又试了一次,它确实起了作用,即使是跨浏览器的最小高度修正。