Question

我正在尝试在页面背景上每次刷新时获取随机图像。它适用于下面的脚本。但是如果我的内容太多，图像就不会扩展到底部并显示其他内容继续的白色区域。我该如何解决？我已经搜索过并且已经找到了诸如垂直对齐，改变字体大小等类似的东西。还将脚本中的backgroundPosition更改为“center bottom”，但这不会改变任何内容。有什么想法吗？

function randomBg() {
        var bgs = new Array();
        bgs.push("images/bg/bg1.jpg");
        bgs.push("images/bg/bg2.jpg");
        bgs.push("images/bg/bg3.jpg");
        bgs.push("images/bg/bg4.jpg");
        bgs.push("images/bg/bg5.jpg");
        bgs.push("images/bg/bg6.jpg");
        bgs.push("images/bg/bg7.jpg");
        bgs.push("images/bg/bg8.jpg");
        bgs.push("images/bg/bg9.jpg");
        bgs.push("images/bg/bg10.jpg");
        document.body.style.backgroundImage = "url(" + bgs[randomize(0, bgs.length-1)] + ")";
        document.body.style.backgroundSize = 'cover';
        document.body.style.backgroundRepeat = 'no-repeat';
        document.body.style.backgroundPosition = 'center';
    }

Answer 1

删除background-position:center。 background-size:cover将“将背景图像缩放为尽可能大，以便背景图像完全被背景图像覆盖。背景图像的某些部分可能不在背景定位区域内”

在背景图象下的白色区域

1 个答案: