背景图像停止响应一定的宽度

问题描述：

我有一个4496x3000图像我用于背景图像。它的响应速度达到了1190px，此时不是。我想也许创建一个媒体查询和使用较小的图像会有所帮助，但事实并非如此。我的代码有什么问题导致它停止响应？背景图像停止响应一定的宽度

body, html { 
 
    margin: 0; 
 
    padding: 0; 
 
    width: 100%  
 
} 
 

 
.bgimg { 
 
    width: 100%;  
 
    background-image: url(../img/pexels-photo-Original-4496x3000.jpeg); 
 
    opacity: 0.65; 
 
    background-position: center center; 
 
    background-repeat: no-repeat; 
 
    background-attachment: fixed; 
 
    -webkit-background-size: cover; 
 
    -moz-background-size: cover; 
 
    -o-background-size: cover; 
 
    background-size: cover; 
 
    background-color: #464646; 
 
} 
 

 
@media only screen and (max-width : 1190px) { 
 
    .bgimg { 
 
     background-image: 
 
      url(../img/pexels-photo-medium-1280x854.jpeg); 
 
    } 
 
}

<body class="bgimg">

当我运行你的代码时，背景没有使用媒体查询是响应式的 – Dark

@BharathShetty谢谢。我会尝试另一张图片，因为这个图片没有响应。 – comfortablyNumb

答

我尝试没有媒体查询的代码和它的工作好做，即我的背景图片响应。你应该尝试使用另一个（更大）的图像，而不使用媒体查询。

是的，我只是在绝望中放上一个媒体查询。这绝对不是我的机器上的工作，所以我会听取您的意见，并尝试其他图像。我认为4496 x 3000是大的。对于背景图像，你会建议多大？ – comfortablyNumb

是的，4096 x 3000是相当大的。我尝试了2048 x 1536尺寸的图像，它工作。你正在使用哪种浏览器？ – shaina

我使用过此图片[http://i.imgur.com/jtmYrxC.jpg]，效果很好 – Dark

背景图像停止响应一定的宽度

相关推荐