Css 为什么我的动画不工作？

我希望运动正常，但背景图像的位置是固定的，不会移动，为什么

@-webkit-keyframes anima {
    from {
        background-position: left;
    } to {
      background-position: right;
    }
}


#bando {
    border-radius: 4px;
    background-image: url(neon.jpg);
    background-size: 120%;
    width: 600px;
    padding-top:40px;
    padding-bottom:40px;
    margin-bottom: 10px;
    font-size: 30px;
    height:200px;
    animation-name: anima;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    animation-direction: alternate;
}

---

感谢您的帮助

为此，请确保图像比元素大（或小），如下图所示，元素宽600px，图像宽800px

@-webkit关键帧动画{
从{
背景位置：左；
}
到{
背景位置：右；
}
}
div{
边界半径：4px；
背景大小：120%；
背景：url(http://lorempixel.com/800/280/nature/1/);
宽度：600px；
填充顶部：40px；
填充底部：40px；
边缘底部：10px；
字体大小：30px；
高度：200px；
动画名称：阿尼玛；
动画持续时间：3s；
动画迭代次数：无限；
动画计时功能：线性；
动画方向：交替；
}

---

您无法设置背景图像的动画对不起，我编辑了我的代码（因为我发布了错误的代码），但这不起作用。可能的问题是，在Safari中，它不起作用，但在chrome@NotWork将在a中添加第2个样本sec@NotWork更新为第二个示例