html - 根据屏幕尺寸缩放div中的背景图像

Question

我有一个包含背景图像的 div，我希望它在右下角保持对齐，但我希望图像根据浏览器窗口的大小进行缩放。我目前拥有的是:

backgnd {
    background: url(img/roneggler.png) no-repeat;
    position: fixed;
    bottom: 0px;
    right: 0px;
    width: 1000px;
    height: 1000px;
}

我已尝试将 width 和 height 值设置为 100% 但这会弄乱 div< 的位置。此页面的链接可在此处找到:http://inetgate.biz/ron.eggler/

Answer 1

你应该使用background-size: cover and width and height 100%;

backgnd {
    background: url(img/roneggler.png) no-repeat;
    position: absolute;
    background-size: cover;
    bottom: 0px;
    right: 0px;
    width: 100%;
    height: 100%;
}