始终缩放的背景图像，以便不会出现任何正常的背景颜色

Question

我想知道是否有一个hack会以一直覆盖整个浏览器窗口的方式调整图像大小。它还应该保持图像的宽高比。

Answer 1

这个网站http://css-tricks.com/how-to-resizeable-background-image/有很好的写作。

基本上只是用作bg的风格

#bg {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

关于你同时保持宽高比的要求，因为它覆盖整个窗口，我不认为这是可以实现的，你要么牺牲宽高比或覆盖

Answer 2

通过jquery

尝试此代码

 var docHeight = Math.max(

            $(document).height(),

            $(window).height(),

            /* For opera: */

            document.documentElement.clientHeight

        );

        var docWidth = Math.max(

            $(document).width(),

            $(window).width(),

            /* For opera: */

            document.documentElement.clientWidth

        );

        $("selector").css({

            "height":docHeight,

            "width":docWidth

        });