Html 通过响应性设计保持背景图像固定

如果你看看这里：

屏幕右侧有一个小的白色边距。不应该是这种情况，因为背景图像应该一直固定到右边缘。如果您尝试其他较小的分辨率，您会注意到这就是行为。但一旦屏幕达到如此大的宽度（1600px），它就会失败

知道为什么会这样吗

---

谢谢各位

将图像宽度设置为自动

#image 
{
width:auto;//you have set 40% which causes the issue
}

---

你可以试试下面的

#image {
    height: 100%;
    position: fixed;
    right: 0;
    top: 0;
    width: 100%;
}


#image img {
    float: right;
    width: 30%;
}

---

一旦屏幕进入“大”尺寸，使用媒体查询将宽度更改为自动

---

你试过下面的CSS吗？这在水平扩展图像时有效，但摆脱了我页面的流畅布局，因此当较小的屏幕使用它时，左侧的内容无法看到，因为背景覆盖了它。有趣的效果，但不是我想要的。

@media only screen and (min-width : 1430px){
    #image{
        width:auto;
        }
    }