Question

我想知道哪个是适合每个屏幕，每个浏览器的背景图像的最佳解决方案。此外，我注意到大多数技术都会略微裁剪图像。我知道有很多技巧可以做到这一点，但我想知道哪个是你认为最好的。谢谢！

Answer 1

这个post from CSS-tricks.com涵盖了全屏背景图像的不同技术，并包括旧版IE的后备（我还没有测试IE修复）。

当我不需要担心支持旧浏览器时，我通常使用CSS3方法：

html { 
    background: url(http://lorempixum.com/1440/900/sports)
        no-repeat center center fixed; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

Answer 2

在body标签内添加：

<img src="img/beach.jpg" 

style="width:100%;height:100%;position:absolute;top:0;left:0;z-index:-5000;">

http://thewebthought.blogspot.com/2010/10/css-making-background-image-fit-any.htmlg

css完美的全屏图像背景

2 个答案: