Html 使用';背景尺寸:100%';

Html 使用';背景尺寸:100%';,html,css,background,resize,fixed,Html,Css,Background,Resize,Fixed,因此,我试图在我的页面左下角使用背景图像,但我希望它得到修复,并随浏览器窗口调整大小 我接近这个目标的唯一方法是使用“背景大小:100%”,然而,这会使图像太高。所以,我不知道该用什么来真正使它合身 有什么建议吗 这是我当前的代码 body { background-color:#000000; background-image:url(Image.png); background-position: 0% 100%; background-attachment:fixed; backgroun

因此,我试图在我的页面左下角使用背景图像,但我希望它得到修复,并随浏览器窗口调整大小

我接近这个目标的唯一方法是使用“背景大小:100%”,然而,这会使图像太高。所以,我不知道该用什么来真正使它合身

有什么建议吗

这是我当前的代码

body {
background-color:#000000;
background-image:url(Image.png);
background-position: 0% 100%;
background-attachment:fixed;
background-repeat:no-repeat;
    background-size: 100%;

}

嗯,
背景大小
需要超过。您可以尝试以下方法:

background-size: auto 100%;
但是,为了简单起见,请首先尝试:

background-size: cover;
这将使背景的宽度自动调整为
100%
高度的纵横比。这保证了背景图像永远不会小于或大于高度,但宽度随浏览器的纵横比而变化

附录


还请注意,并非所有浏览器都支持背景大小。如果对Internet Explorer的支持对您来说是个问题,那么我强烈建议您使用Javascript。我还强烈建议阅读《永远可爱的克里斯·科伊尔》的文章。它讨论了各种各样的回退

谢谢“D现在很好用了。@Melissame:请查看我添加的附录,我觉得它比“仅仅找到解决方案”更有帮助。