设置background-size为cover时能铺满但是图片显示不完整

body{
        background: url("bk.jpg"); 
        background-size:cover;
        background-repeat:no-repeat;
    }

   在全屏时设置background-size为cover时能铺满但是图片显示不完整,设置100%也是不完整,但是浏览器为窗口状态时图片就完整
阅读 28.5k
7 个回答
body{
        background: url("bk.jpg") no-repeat center; 
        background-size:100% 99.9%; 
    }
    

你是想要contain的效果吧?cover是会铺满但会裁剪图片的,

建议看下开发者工具中显示的实际样式跟你写的样式是不是一致。另外多说一句,第一行的background是其缩写形式,如果分开写的话建议将background-image写全。

background-size:container

body加上宽度和高度试试。

保证图片比例和盒子比例一致。

给一下height:100% 和 width:100%看看,还有看看是不是兼容的问题

        width: 100%;
        height: 100%;
        background: url(img/bg.jpg);
        background-size: 100% 100%;
        -moz-background-size:100% 100%;
          -webkit-background-size:100% 100%;
          -o-background-size:100% 100%;
        background-repeat: no-repeat;
        /*ie兼容背景满屏*/
        background-image: url('img/bg.jpg');
        background-size: cover;
        filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='img/bg.jpg',  sizingMethod='scale');
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题