为什么这段动画第一张图片往左后后面的图片都没有显示出来？

这是第一张图片向左移动 后面不是应该跟着第二张图片吗，但是却是如图所示空白的

<div>
            <ul>
                <li>
                    <img src="imgs/lunbo1.jpg">
                </li>
                <li>
                    <img src="imgs/lunbo2.jpg">
                </li>
                <li>
                    <img src="imgs/lunbo3.jpg">
                </li>
                <li>
                    <img src="imgs/lunbo4.jpg">
                </li>
                <li>
                    <img src="imgs/lunbo5.jpg">
                </li>
            </ul>
        </div>

div{
                    width:1226px;
                    height: 460px;
                    margin: 50px auto;
                    overflow: hidden;

                    position: relative;
                }
                ul{
                    animation: 16s lunbo infinite;
                    position: absolute;
                }
                li{
                    float:left;
                    list-style: none;
                    
                }
            
                @keyframes lunbo{
                    0%{right:0;}
                    25%{right:460px;}
                    50%{right: 920px;}
                    75%{right: 1380px;}
                    100%{right: 1840px;}
                    
                }

---

根据你提供的代码，并不存在你所说的“后面的图片都没有显示出来”，有点不太明白“后面的图片都没有显示出来”是什么意思

---

把现在的效果图也发出来吧