Html 如何删除水平滚动条？

当用户的设备宽度超过480px时，我将向他显示原始GIF作为我网站的背景

我的HTML：

<img class="background" src="assets/img/960XAUTO.gif" alt="Pink Smoke Background">

当用户的设备宽度小于480px时，我将我的GIF宽度增加到200%，因为在不增加烟雾的情况下，烟雾看起来非常通俗和消瘦：

因此，我在CSS中这样做：

@media screen and (max-width: $breakpoint) {
    .background {
        position: absolute;
        left: -50%;

        max-width: 200%;
    }
}

这里有一个问题。由于我的GIF增加了2倍，我得到了水平滚动条。看看：

---

我真的需要增加GIF，这样烟雾看起来更广泛。如何删除右侧由GIF创建的空白位置？或者也许有其他方法来增加GIF的宽度？我试图以不同的方式使用溢出。此外，我还尝试将

body

宽度设置为设备屏幕的100%。

将其添加到CSS中，以引用您需要的元素（它应该是整个

html

或

body

，如本例所示，如果这是您的整个网站背景，顺便说一句）：

---

将其添加到CSS中，引用您需要的元素（它应该是整个

html

或

body

，如本例所示，如果这是您的整个网站背景，顺便说一句）：

---

添加

后台附件：固定以您的风格

代码精确：

.background {
      display: block;
      background-attachment:fixed;
      height: 100%;
      margin: 0 auto;
}

添加
后台附件：固定以您的风格

代码精确：

.background {
      display: block;
      background-attachment:fixed;
      height: 100%;
      margin: 0 auto;
}

您应该尝试使用具有可选缩放百分比的背景中心。
完整的编辑在这里

当然，只要放下一个div

<div class="bg"></div>

您应该尝试使用带有可选缩放百分比的后台中心。
完整的编辑在这里

当然，只要放下一个div

<div class="bg"></div>


为什么不直接使用
background
属性而不是实际的图像？你能发送一个图像gif的url或至少是礼物的实际尺寸吗？你能做个提琴什么的吗？@SzabolcsPáll，这个bug有一个实际的代码-@Ody，在这里你可以找到这个网站-为什么不直接使用
background
属性而不是实际的图像？你可以发送一个图像gif的url或者至少是gif的实际尺寸吗？你可以做一个提琴什么的吗？@SzabolcsPáll，有一个关于这个bug的实际代码-@Ody，在这里你可以找到这个网站-它对我没有帮助。但是我在我的媒体规则中将
位置：绝对
改为
固定
，现在对我有效！这对我没有帮助。但是我在我的媒体规则中将
位置：绝对
改为
固定
，现在对我有效！
<div class="bg"></div>